當前位置:編程學習大全網 - 編程語言 - UI界面版式設計實用小技巧有哪些?

UI界面版式設計實用小技巧有哪些?

UI界面中實戰版式技巧分析1. 版面中的空間關系元素在界面版式設計中,可以運用平面設計中的結構思考方法去理解UI界面中的空間元素結構的分布對應,下面以新聞類客戶端為例進行頁面元素分析 2. 內容過多處理方法為了讓閱讀更有效,可以采用不同標題規格、不同編排比例或不同色底進行層次上的劃分 3. 模塊化分割方法線條分割和空間分割的區別,分割線給人壹種壓迫感,而空間的分割給人更加輕松的閱讀感受 4. 如何改變版面圖版率與視覺空間比重我們來看下qq音樂會員中心頁面的設計,不同的等級對應不同的顏色card,運用顏色填充背景吸引用戶增加界面專屬比重,起到賬戶切換視覺的引導作用,是壹個很好的設計思路 5. 根據主題選擇配圖及配色方案我們在做設計時很多時候會去追求“高級灰”、“高逼格”亦或者是“獨特性”,其實更重要的是要符合產品的調性和產品對象人群,不能壹味的去追求自我的“設計追求”,比如下面的2個案例就很好的表達出了產品的調性,明確的告訴用戶我是做什麽產品的,為什麽樣的人群去服務的 6. 畫面焦點表示在畫面中相對更加突出的內容,讓用戶在瀏覽產品時能夠第壹視覺捕捉用戶的眼球;焦點是相對的,在大頁面中可以是焦點,在小模塊中也可以是焦點 6.1 頁面中焦點采用模態效果的彈窗給人以不可忽視的方式出現 6.2 模塊中的焦點我們可以看到在優酷的“我的”頁面信息以卡片的形式呈現,而會員購買入口則以壹種帶有色彩傾向性的顏色設計,表達了其的重要性;還有優酷的首頁精選的卡片中“全網獨播”等角標的設計在每壹個模塊中都很搶眼,很容易就能夠捕捉到用戶的視覺重心;蘋果手機自帶日歷中當前日期的紅色選中態以絕對的焦點方式設計呈現給用戶 7. 界面平衡平衡是版面元素上下左右比例都比較適中,給人壹種穩定和平衡的視覺感受。平衡的版式設計可以讓畫面穩定不會產生上下比重失衡的現象,平衡的比例構圖令人愉悅,而不平衡的設計會造成不穩定的分散註意力。視覺平衡是指在設計中的負元素和正元素比例相對合適,設計師的作用就是發揮元素的視覺重量的構圖平衡。 8. 字體的選擇很多時候有的設計師在做界面時候都希望全端的字體能夠統壹,最好的辦法是嵌入文字包,但給代碼包增加了負擔,所以我們需要去取舍!很多國產安卓手機都有自己的系統字體,要實際調研真機效果(如差異不大非必須嵌入字體)蘋果和安卓常用字體如下 9. 有節奏感的版式設計節奏感的設計表現形式有很多種,比較常用的是在統壹的樣式節奏中穿插不同的模塊來使得頁面的節奏感更加的跳躍和靈活,比如Medium、網易雲音樂的版式設計中都運用了節奏感的設計方法跳躍的節奏感給人以活潑和時尚現代的感受,不會讓畫面通盤單壹且枯燥的呈現給用戶;靈活的節奏感也為很多付費內容提供了很好的呈現方式 10. 常用版心邊距距離整理不同行業的邊距大小不同,內容信息較多的文字類和購物類產品的邊距相對較小,而很多以圖片、視頻和音樂為主的產品相對較大!

  • 上一篇:幼兒園學前班美術:遊泳真開心的教案與反思
  • 下一篇:為什麽下載的音樂在U盤中聲音很小很難聽
  • copyright 2024編程學習大全網