h5設計重點劃分為6個關鍵分支(組成部分)
3.1 認識h5的原型圖
原型圖應用十分普遍,它是網際網路產品執行前的框架樣式,分為三個階段:線框圖→原型圖→高保真,原則上原型圖由ue(互動設計師)完成,pd(產品設計師)、pm(產品經理)、ui(介面設計師)以及開發工程師進行溝通。
原型圖分為兩個階段,構思原型圖和演示原型圖。原型圖應具備的元素主要包括視覺,動效,節奏,互動,聲效,可實施性。
原型圖的作用就是乙個總體的計畫,能夠減少返工和摸索的時間。
3.2 把握好h5設計的表現力
h5主要表現力提現在三個方面,視覺氣氛(最基礎)、形式感(中堅力量)、參與互動(最有效)
視覺氣氛主要表達兩點:1.統一的背景,2.成套的色彩和元素。
3.3 h5頁面的版式設計要領
1)畫幅尺寸差異 一般5.5 1980-1080設計為要
2)閱讀方式 手機自上而下,a4紙左右而向
3)內容接收習慣不同
1)分清ppt與h5頁面的差異
2)具備畫面焦點意識
強焦點板式 散焦點板式 頁面視覺的平衡
3)頁面視覺的平衡
頁面視覺需要畫面的空間感
3.4 h5的文字設計
文字設計是h5設計必不可少的乙個環節,而文字設計又不僅僅是字型字形的設計,它還包括文字排版,文案設計,具體描述等多方因素。常用的文字設計軟體是ps和ai。
作為設計師,應具備一定的文案判斷能力,改變自己的固有觀念。
現代人隨時隨地接收訊息,需要建立在使用者思維上。
例如:xx飲料,享受生活,期待精彩,開創飲料新時代對比 吃飽了,來一瓶
強調使用者體驗的設計,量化和細化場景是關鍵。
1)看待數字在文字中的運用--大資料易識別,小資料易簡單,正反向穿插
2)創造文字上的感官矛盾----營造大和小或者失敗與成功的矛盾
3)誇張修辭法--注意採集生活常識比方說炸鍋了
4)標題長度對閱讀流失的影響---抓住關鍵點
據說h5面臨生死存亡的困境,這裡有真實分析----新規出台,h5行業真的夠嗆
5)引起讀者的好奇感
1)簡化擠壓的文字
3.5 h5的動效設計
h5的動效設計將從概念,常識和技巧三方面講解,動態對人的吸引力遵循動態→顏色→圖形。一方面多維度資訊需要動效串聯,另一方面利用在時間維度上的變化來讓內容更有條理,需注意:
h5可以做出哪些動效?
動效在h5中的應用?
轉場類的動效**場時間要快,引導過度自然,)
3.6 h5的聲效設計
聲音是h5設計中,經常疏忽的,聲音包含3個類別,以音效,配樂和**等3個類別。
h5的背景音效,以聲畫對位和聲畫錯位(執行難度較大,影視作品是最好的參考),h5背景音效分類3大類:1.氣氛烘托類伴奏,2.人聲烘托伴奏,3.氣氛塑造類聲效。
h5的輔助音效分為三大類:功能音效,擬聲音效,環境音效。
文字和部分**於h5+移動營銷設計寶典-蘇杭著
01 移動營銷設計 認識H5與廣告
1.1 傳統廣告怎麼了?4a廣告體系 源於美國,為 美國廣告協會 即 the american association of advertising agencies的縮寫。因名稱裡有四個單詞是以a字母開頭,故簡稱縮寫為4a。美國廣告協會是上世紀初由美國各大著名廣告公司所協商成立的組織,成員包括 o...
h5策劃書 乙個好的H5營銷活動設計要如何進行策劃
h5營銷的設計可以分為兩個部分,創意性和可操作性。企業商家可以從這兩個方面進行營銷活動內容的策劃,使活動更有吸引力。一 創意性 創意性是h5活動的靈魂,乙個好的h5活動可以是別具一格的,如果h5營銷缺乏創意性,只是簡單的頁面堆砌,模板痕跡重,使用者開啟後可能會沒有想要繼續下去的想法,沒能夠吸引住使用...
移動端h5頁面的設計稿尺寸
那麼多手機螢幕尺寸,設計稿應該按照哪乙個尺寸作為標準尺寸。現在已經有2k解析度的手機螢幕了,設計稿是不是也要把寬高跟著最大解析度來設計。顯然不是。請注意 以下所有討論內容和規範均將viewport設定為content width device width 的情況下 也就是我們的h5頁面前端 裡面必須...