基礎(chǔ)知識,分享常用的對齊技巧
對齊與間距,無非左右上下的關(guān)系,怎樣才能讓符合用戶的視覺感知呢?蕓蕓眾生,紅塵滾滾,有幸讓他(她)瞄上一眼,留下個(gè)“很舒服”的第一印象,非常重要,而且在實(shí)際設(shè)計(jì)的流程中,如果經(jīng)常因?yàn)槟睦餂]對齊被批,會(huì)影響整個(gè)團(tuán)隊(duì)效率,你在團(tuán)隊(duì)中信任度也會(huì)降低。不要迷信什么大神了,還是把自己當(dāng)前水平該掌握的基礎(chǔ)知識,拿到手,更靠譜。
說的玄乎點(diǎn)是設(shè)計(jì)師的態(tài)度,說大白話就是基礎(chǔ)不牢固,還總要建高樓。好,不念經(jīng)了,說基礎(chǔ),希望能發(fā)揮點(diǎn)作用。
一、基礎(chǔ)操作方式工欲善其事,必先利其器。
利用參考線對齊。在Photoshop的【編輯】-【首選項(xiàng)】菜單中可以設(shè)置合適的網(wǎng)格尺寸。
在設(shè)計(jì)前期將界面進(jìn)行設(shè)置框架參考線,通過參考線將按鈕、文字、圖形對齊。
PS參考線小插件-GuideGuide
這是一個(gè)非常便捷的畫參考線的工具,讓你節(jié)省了時(shí)間去算參考線。在插件你可以輸入一些數(shù)字,GuideGuide可以通過你設(shè)定的單位自動(dòng)劃分號好網(wǎng)格。這個(gè)軟件最強(qiáng)大的地方就是:可以通過畫布中選區(qū)的大小生成對應(yīng)的網(wǎng)格參考線。真是畫參考線的神器也!
界面中常用對齊形式對齊三大招:齊行、居左、居中。(貌似初一就學(xué)過,干活卻老忘)
齊行式:運(yùn)用在閱讀性文本中,比較長的文本段。一般用在詳情頁中。(圖:貓眼電議)
居左式:這種用的比較多,常常運(yùn)用在APP的設(shè)計(jì)中,列表信息展示等。這種對齊方式比較容易閱讀,能很好的區(qū)分主次文本的層次。(圖:淘寶)
居中式:主要使用在信息流式的文本表現(xiàn)方式中。(圖QQ音樂)
- 相關(guān)教程
- TA的教程
- 收藏
- 返回
- ps基礎(chǔ)教程
- 基礎(chǔ)知識
- Micu設(shè)計(jì)
- 用的
- 對齊
學(xué)習(xí) · 提示
相關(guān)教程
推薦教程
- 色彩知識,講解顏色基礎(chǔ)知識和配色理論
- UI知識,尺寸對UI設(shè)計(jì)的影響
- 顏色管理,讓自己的照片在網(wǎng)上正確地顯示
- 用戶體驗(yàn),如何讓用戶心動(dòng)?
- 圖片畫冊平面設(shè)計(jì)排版ps理論教程
- Photoshop初級教程-命令的技巧
- 設(shè)計(jì)界面最常用最舒服的12種顏色(含色
- 移動(dòng)設(shè)計(jì),移動(dòng)應(yīng)用導(dǎo)航模式設(shè)計(jì)方法
- 調(diào)色知識,簡單實(shí)用的調(diào)色原理
- 用戶體驗(yàn),分享20個(gè)有影響力的包裝設(shè)計(jì)