1、網站設計前需要製作網站原型圖嗎
是的,需要製作網站效果圖,要吧網站大致效果和框架定好,才能更好的進行一步代碼和後台的製作,網站原型圖是網站建設前的基礎,每個專業網站建設公司應該 都是需要的,這樣子才更有思路條理
2、Axure 設計網站原型時,網站寬度和高度怎麼設置比較好
【頁面尺寸】網頁的尺寸受限於兩個因素:一個是顯示器屏幕(顯示器現在種類很多,17寸為主流,正在朝19寸及寬屏的方向發展,但目前也有為數不少的15寸顯示器)另一個是瀏覽器軟體(我們常用的IE、遨遊、Friefox等)
【頁面高度】高度是可以向下延展的,所以一般對高度不限制。對於一屏來說一般沒有一個固定值,因為每個人的瀏覽器的工具欄不同,所以高度沒有確切值。
【頁面寬度】
1、在IE6.0下,寬度為顯示器解析度減21,比如1024的寬度-21就變成1003。但值得注意的是IE6.0(或更低)無論你的網頁多高都會有右側的滾動條框。
2、在Firefox下,寬度的分率辨減19。比如1024的寬度-19就變成1005
3、在Opear下,寬度的分率辨減23。比如1024的寬度-23就變成1001
如果是1024的解析度,你的網頁不如設成1000安全一點。設成900兩側空白更大,視覺上更舒服一點。也方便做一些浮動層的設計。如果是800的解析度一般都設成770。但也有設成760的。這些需要明白並且牢記,不然很可能做出來不符合瀏覽器要求。不過一般我們都會設定的再稍微小一點,因為有些瀏覽器加了插件或者其他的東西寬度會有變化,所以 800的解析度一般設定760左右,1024的設定990左右。
網頁設計標准尺寸參考:
1、800*600下,網頁寬度保持在778以內,就不會出現水平滾動條,高度則視版面和內容決定。
2、1024*768下,網頁寬度保持在1002以內,如果滿框顯示的話,高度是612-615之間,就不會出現水平滾動條和垂直滾動條。
3、頁面長度原則上不超過3屏,寬度不超過1屏,每個標准頁面為A4幅面大小,即8.5X11英寸。
4、全尺寸banner為468*60px,半尺寸banner為234*60px,小banner為88*31px (另外120*90,120*60也是小圖標的標准尺寸 )
5、每個非首頁靜態頁面含圖片位元組不超過60K,全尺寸banner不超過14K
【網頁廣告尺寸】
1、120*120,這種廣告規格適用於產品或新聞照片展示。
2、120*60,這種廣告規格主要用於做LOGO使用。
3、120*90,主要應用於產品演示或大型LOGO。
4、125*125,這種規格適於表現照片效果的圖像廣告。
5、234*60,這種規格適用於框架或左右形式主頁的廣告鏈接。
6、392*72,主要用於有較多圖片展示的廣告條,用於頁眉或頁腳。
7、468*60,應用最為廣泛的廣告條尺寸,用於頁眉或頁腳。
8、88*31,主要用於網頁鏈接,或網站小型LOGO。
【廣告形式 像素大小 最大尺寸】
BUTTON 120*60(必須用gif) 7K;215*50(必須用gif) 7K
通欄 760*100 25K 靜態圖片或減少運動效果;430*50 15K
超級通欄 760*100 to 760*200 共40K 靜態圖片或減少運動效果
巨幅廣告 336*280 35K;585*120
豎邊廣告 130*300 25K
全屏廣告 800*600 40K 必須為靜態圖片,FLASH格式
圖文混排 各頻道不同 15K
彈出窗口 400*300(盡量用gif) 40K
BANNER 468*60(盡量用gif) 18K
懸停按鈕 80*80(必須用gif) 7K
流媒體 300*200(可做不規則形狀但尺寸不能超過300*200) 30K 播放時間 小於5秒60幀(1秒/12幀)
【網頁中的廣告尺寸】
1.首頁右上,尺寸120*60
2.首頁頂部通欄,尺寸468*60
3.首頁頂部通欄,尺寸760*60
4.首頁中部通欄,尺寸580*60
5.內頁頂部通欄,尺寸468*60
6.內頁頂部通欄,尺寸760*60
7.內頁左上,尺寸150*60或300*300
8.下載地址頁面,尺寸560*60或468*60
9.內頁底部通欄,尺寸760*60
10.左漂浮,尺寸80*80或100*100
11.右漂浮,尺寸80*80或100*100
3、如何設計出色的網站後台原型
1、畫原型之前,先理清後台管理的功能模塊,通過樹狀結構圖來幫助自己劃分頁面和模塊。
2、理清模塊之後,就可以著手設計後台管理系統的骨架,老漁哥認為可以分為三種:主模塊(主要分為哪些獨立的功能模塊),次級分類(每個功能模塊又有哪些次級的功能分類),功能事件(具體到每個功能頁面內存在哪些主要的操作)
3、思維導圖幫助理清思路很有幫助。
4、思考的路線應該是自上而下,在進行模塊劃分時不要拘泥於具體的某個界面的展現形式。
4、網站原型設計工具有哪些
有很多呀, Axure, Basamiq 等等。像我們團隊用戶的就是摹客Mockplus. 提供很多模板和豐富的組件資源,交互原型拖一拖就完成了。 還可以團隊協作、分享和迭代。
5、網頁設計流程,用畫原型圖嗎?邏輯誰來設計
首先要有網頁或者說是網站的需求方提供需求內容。
例如頁面要包括哪些,如用戶登錄,注冊,信息展示,甚至在線支付之類的東西。
然後還要有一些具體功能需求,如用戶注冊需要提供哪些資料,如身份證,地址之類的信息。
信息展示具體是哪些。
有需求方先要寫明自己的需求,然後根據需求進行下一步的設計,原型圖肯定要畫,因為沒有圖就無法製作網頁。
先把圖畫好,然後和對方商定細節,例如logo的大小,段落間距,字體顏色,之類的細節東西。
畫好圖並確定後就可以按照圖來製作網頁。
至於內部後台相關也要商定。
具體由誰來做什麼要視情況而定。
例如如果對方公司有美工之類的,可能就直接給你一些素材甚至畫好的圖讓你直接製作。
也有可能需要你自己畫圖或者找人畫圖。
6、如何進行web頁面原型圖設計
簡單來說,產品經理進行頁面原型設計時,只需要把業務邏輯和交互邏輯講明白,不需要做得特別精美,而是要把握重點,把重心放在分析用戶需求、規劃產品功能上。之後交互設計師可以根據產品經理的原型圖進行設計。
從使用工具來看的話,產品經理在做原型時其實只需要Mockplus或摹客原型這樣的快速原型設計工具。只要提前想清楚主要的功能點和交互邏輯,使用工具內置的現成組件,十分鍾就能把原型做完。
交互設計師需要做的是根據產品經理繪制的原型版和相關產品文檔,繪制高保真原型,通常交互設計師會使用PS、sketch、XD之類的設計工具,在完成頁面設計後上傳到摹客等協作平台添加交互。完成後也可以直接發鏈接給其他成員審閱,這時候主要看的就是原型呈現的視覺效果了。
7、如何設計出色的網站後台原型
網上很多坐原型的軟體。不過這種只是工具,更多的還是人的思維
8、如何設計出色的網站後台原型
明確目標
既然是做原型的角度,我們就從具體工作來談,首先要明確的肯定是產品目標,比如以下幾個問題:
是全新的產品,還是更新改版?
有沒有相匹配的前台系統?或者其他需要配合的線下資源?等等
業務層面的目標是什麼?新增功能?體驗優化?等等
需求分析
明確了產品目標,在做需求分析的時候就會有所側重,總的來說,值得關注的有以下幾個要素:
1、角色許可權
這個非常重要,一定要在具體設計之前熟悉管理後台的所有類型用戶。包括一共有幾類用戶,他們各自的使用需求,操作許可權,還有用戶許可權的設計。
2、信息架構
一定要畫信息結構圖(即產品層面的數據模型),主要用於理清產品結構。畫一下腦圖,列一個excel表單,詳細程度依據自己習慣即可,需要和用戶配合起來設計。
這個是和普通原型設計比較不同的一點,如果是改版還需要特別標注和舊版的區別,以及舊數據的清理或遷移方案。另外,還需要考慮和其他資源(前台、對應頁等)的配合,數據流向以及狀態轉移等。
4、功能流程
常規需要考慮的用戶流程和業務規則流程。根據不同的業務目標,用戶流程可以按場景或功能進行劃分,給予部分用戶適當的優化。業務規則流程需要保證邏輯清晰,閉環,不要遺漏異常流(閉環很重要)。
原型設計
終於可以開始原型設計啦,現在各種管理後台的主題模板都有很多,沒有特別需求的情況下,和開發溝通好選擇一套「抄」即可。
設計過程中注意一下導航,列表(增刪改查排序篩選)等,細節上不要遺漏預覽、錯誤/成功提示、新內容提醒、快捷鍵等