APP界面設計元素與頁面布局

1、界面設計元素頁面布局,2020/4/8,1,界面設計元素,常用的界面世界元素有：圖像、圖標、文本、數(shù)字、符號、表格、動畫、視頻等,2020/4/8,2,頁面布局,1,視覺層次結(jié)構,要確定視覺層次結(jié)構（即重要程度區(qū),分），首先要明確,app,的用途及主要服,務對象。是內(nèi)容為王還是娛樂為主，或,者是功能為王,公交,app,設計的初衷是,為使用者提供最快或者最便捷的公交訊,息，強調(diào)功能的重要性,2020/4/8,3,頁面布局視覺層次結(jié)構,按操作行為區(qū)分,用戶使用公交,app,的目的是獲取相關公,交班次和位置信息等，同時伴隨其他,的輔助功能如（拼車、天氣、附近設,施等,按操作行為的發(fā)生頻率可對,其操作

2、行為做一個排列。相應的功能,可通過主標題分布、二級標題、二級,內(nèi)容、注釋等形式排布,2020/4/8,4,頁面布局視覺層次結(jié)構,按操作行為區(qū)分,對現(xiàn)有公交,app,界面中涉及的所有用戶操作,行為進行統(tǒng)計和分類，對其進行權重分析,再分析完成每個目標所需要的操作時間和,步驟數(shù)，評價出最優(yōu)化的布局方式,2020/4/8,5,頁面布局視覺層次結(jié)構,按信息認知劃分,在一個操作界面上，會同時分布很,多信息。雖然每個信息的重要程度,都不同，但每一個信息又不可缺,這就需要在同一界面上進行重要度,區(qū)分,在頁面布局上，可通過信息,模塊的位置、大小、色彩或狀態(tài)等,形式對其重要度進行區(qū)分,2020/4/8,6,頁面布

3、局視覺層次結(jié)構,按信息認知劃分,對現(xiàn)有公交,app,界面中在一個界面中各類信,息的排布和標重方式做一個對比。從用戶,的認知模型角度分析，確定哪種排布和標,重方式最優(yōu),2020/4/8,7,頁面布局視覺層次結(jié)構,視覺層次結(jié)構小結(jié),在進行頁面布局時，要謹記用戶的認,知心理和閱讀習慣（從上到下，從左,到右），以及功能權重、信息認知容,量。將設計美學中的元素如留白、圖,底關系、平衡、轉(zhuǎn)換、視覺引導等視,覺原理合理地運用起來,平衡用戶的,認知能力，優(yōu)化信息組織形式及交互,手段,2020/4/8,8,頁面布局視覺流,2,視覺流,如何引導用戶的視線，即視覺流。視覺,流的作用是引導用戶接下來我要看什么,一般可通過在頁面上建立焦點吸引用戶,的視線。焦點可通過其本身的大小、高,度、位置、字體粗細、色彩、變異、圖,形或線條引導、圖標狀態(tài)等形式構建,2020/4/8,9,頁面布局分組和對齊,3,分組和對齊,分組和對齊的用意在于誰和誰在一起，體,現(xiàn)頁面之間元素的關聯(lián)或區(qū)別。分組和對,齊在一定程度上可以引導視覺流?？蛇\用,格式塔原理中