These small details create a unified icon set and bring polish to your design.
The many icons used in Dovetail’s app shared line thickness, slightly rounded corners, and looked similar in size. The large text block was airy due to its generous leading (i.e., the distance between the baselines of two consecutive lines of text) and, together with the relatively short line length, allowed for comfortable reading (and editing) experience, since the eye could easily locate the next line down. For example, in the sidebar navigation, Add a view and New tag board are both unbolded and gray indicating they were the same type of action (creation Avoid using many different type styles in your design, so you do not overwhelm your users. Each variation was used to differentiate between types of content, thus taking advantage of the Gestalt law of similarity. Within this font family, there were multiple type text styles and color variations (navy blue and gray). Dovetail used a single font family to provide a consistent typographic experience. Type styles for different types of content. Setting up a grid in your designs will keep elements aligned consistently across different screens. The middle column of text was also left aligned to a grid line, and the rightmost grid line separated the tags and comments area. The leftmost grid line provided a vertical anchor for the sidebar navigation. A 3-column grid acted as a base to which elements are aligned. Dovetail used a basic column grid, an airy text block, various type styles, and visually consistent icons to create a pleasant editing experience.Īlignment to a grid.
0 kommentar(er)
