近期於前端開發時常會被 PM 要求先提個 Mockup 來看看呈現效果之類的。有鑑於公司目前的人力配置一直沒有規劃到 UI / UX 這個領域,那就自己下來碰碰看吧。這篇筆記的是六角學院的 UI 設計入門:畫出有程式邏輯的設計稿 中關於「C.R.A.P. 設計準則」的介紹。
課程相關資訊
[連結]:https://courses.hexschool.com/courses/ui/lectures/13038990
本篇範圍:Chapter 5 ( 原子設計第二階段:分子 ) ,一共有 13 篇
請注意:本系列文章為個人對應課程的消化吸收後,所整理出來的內容。換言之,並不一定會包含全部的課程內容,也有可能會添加其他資源來說明。
筆記
1. Contract, Repetition, Alignment, Proximity ( 對比、重複、對齊、相近 )
2. 對比是用來強調元件的重要性,相對程度的高低
3. 重複用來代表一致性,在字型、顏色、排版和間距的邏輯,用相似的設計來讓使用者能快速進入狀況
4. 對齊是用來引導使用者的視線,減少視覺干擾
5. 間距可以用來分組