2019-10-31 鶴鶴
-
-
上圖文字與圖片交疊錯落排版，圖片與圖片之間也是網格交錯
上面移動端設計，設計師通過留出左側空網格，整體內容往右側偏移，導航相對內容來說做了差異化設計，并未進行偏移設計（看我上圖紅框部分） 。這樣做的目的是因為，我們點擊漢堡菜單的時候，本來整體就要往右側移動，如果再繼續移動，那么內容會顯示不下，同時視覺效果并沒有很好
半偏移網格布局，界面中并非所有的內容都偏移底層網格，而是部分模塊這樣去做，原因是內容多的情況下。
分屏布局，顧名思義就是將屏幕進行幾種不同區域的劃分，然后內容分布排版在里面，分屏布局解決的主要問題將屏幕大的設備進行合理劃分空間設計，一般是在橫屏運用比較多，比如PAD，或者WEB或者車機中控屏，下面一起看下分屏布局在實際設計中的具體表現
上圖界面設計采用了1/2分屏布局，將圖片與內容文字進行區域劃分，下圖是將主文案擺放在分割區域中間（文字較少情況下可以這樣去做）增強形式感。當然分屏布局可以有多重形式，列如，2/3,1/3，3/4等等，可以根據內容進行選擇合適分屏
-
地址:https://www.stereo.ca/project/clinique-dentaire-gagnon/
地址:https://www.stereo.ca/project/clinique-dentaire-gagnon/
卡片布局還有一個最大好處就是，他能夠封裝內容，使得畫面布局整潔，所有內容都往容器里面放，信息之間保持很好的區分
全封閉卡片布局，內容之間通過卡片封裝，中間無空隙
-
上面利用樂高積木思維重新對布局進行拆解組合，當然一切的布局都是基于當前你的主旨，你的產品內容，找到合適布局，然后去研究他，并且拆解，然后重新搭建屬于自己產品一套布局規則
-
全文向大家介紹5種布局思路，當然其實不止這5種，但是其他布局相對來說會運用少一些，這些布局我們可以加以學習利用，可以運用在任何設計中去，當然運用的時候，一定要清晰知道自己產品的主旨目標，用戶群體，合理運用布局，做出創新設計！
轉自：站酷-設計TNT