Example of templates

Showcase, discuss, and inspire with creative America Data Set.
Post Reply
Arzina3225
Posts: 27
Joined: Sun Dec 22, 2024 3:17 am

Example of templates

Post by Arzina3225 »

Example of molecules

3. Organisms
The next logical step is to combine different molecules, to arrive at organisms. Organisms are just like molecules easy to find on a website. Think of a footer, a login section or the header. A header often contains a logo, navigation and a search function. Together you can consider them as a clear part of the website, which makes it an organism.

The main goal in creating the organisms is that all functions (molecules) get a place in the organisms. This way you don't miss any functions and your design still remains logical and easy to understand.

Also read: The 10 web design trends for 2017

Example of organisms

4. Templates
In templates, pages come together. We take needle and thread and form all the separate organisms into a whole. If your organization does not use atomic design, there is a chance that a template will be created first. This is followed by the filling in of this, such as molecules and organisms.

For example, creating mock-ups is a common step that is done before designing or choosing buttons, fonts and colors. Templates can eventually be reused for multiple pages.



5. Pages
The final step is creating pages. The big difference canada whatsapp number with the templates is that the pages are filled with content. The pages each have their own purpose. The templates that were still empty did not have a clear purpose. Because not every page has the same purpose, the templates can easily be adjusted. After all, you already have your atoms (colors, fonts) at hand.

Image

Atomic design

Now you've gone through all the steps of atomic design. But what have you really created and what can you do with it? You have a huge overview of large and small components, with which you can easily steer the user experience in the right direction.
Post Reply