Have you ever felt that your designs are just so-so? Or sometimes you think it inferior to look at other people's more saucy designs?
Everyone must have experienced that period, but how can we upgrade our designs to another level?
Have you ever felt that your designs are just so-so? Or sometimes you think it inferior to look at other people's more saucy designs?
Everyone must have experienced that period, but how can we upgrade our designs to another level?
The easy way is to do design exploration using the OIM (Observe, Imitate, Modify) method.
The easy way is to do design exploration using the OIM (Observe, Imitate, Modify) method.
Here are the steps I usually take when doing design exploration
Here are the steps I usually take when doing design exploration
1. Defining Customizable Assets
1. Defining Customizable Assets
When we see some layout references from UI Design that are out there, it will inspire us to pour ideas and what we can improve on other people's designs. So, determining the layout becomes an integral part at the beginning when we want to start exploring design.
When we see some layout references from UI Design that are out there, it will inspire us to pour ideas and what we can improve on other people's designs. So, determining the layout becomes an integral part at the beginning when we want to start exploring design.
After we have an overview of the layout we want to create, the next step is to determine what theme or content is suitable for the form that has been selected. For example, we can look for references to similar applications or designs of Home Visualizer to analyze what data and content already exist and what we can improve.
We can look for references from the website chamjo.design for live apps or dribbble for visual references.
After we have an overview of the layout we want to create, the next step is to determine what theme or content is suitable for the form that has been selected. For example, we can look for references to similar applications or designs of Home Visualizer to analyze what data and content already exist and what we can improve.
We can look for references from the website chamjo.design for live apps or dribbble for visual references.
3. Create a design sketch
3. Create a design sketch
The next step is to sketch on paper to determine the final layout and what information we will include.
The next step is to sketch on paper to determine the final layout and what information we will include.
The next step from the sketches we have made before is to convert the drawings into digital form (wireframe). At this stage, we have not yet entered design assets (images, icons, etc.) to ensure that the layout and information are neat.
The next step from the sketches we have made before is to convert the drawings into digital form (wireframe). At this stage, we have not yet entered design assets (images, icons, etc.) to ensure that the layout and information are neat.
5. Color and component exploration
5. Color and component exploration
From the wireframe we created, the next step is to determine and explore the right and suitable colors for the design. For the color itself, we can reference other people's designs or generate colors from the coolors.co website.
And we also need to determine the shape of the final component of the design we create so that it is easier when inserting design assets (images, icons, illustrations, etc.).
From the wireframe we created, the next step is to determine and explore the right and suitable colors for the design. For the color itself, we can reference other people's designs or generate colors from the coolors.co website.
And we also need to determine the shape of the final component of the design we create so that it is easier when inserting design assets (images, icons, illustrations, etc.).
After determining the color, look for images that match the color of the design, and add icons or illustrations based on the color that has been selected. This is one of the tricks to make our design look harmonious.
After determining the color, look for images that match the color of the design, and add icons or illustrations based on the color that has been selected. This is one of the tricks to make our design look harmonious.
After determining the color, look for images that match the color of the design, and add icons or illustrations based on the color that has been selected. This is one of the tricks to make our design look harmonious.
After determining the color, look for images that match the color of the design, and add icons or illustrations based on the color that has been selected. This is one of the tricks to make our design look harmonious.
7. Create the final presentation
7. Create the final presentation
The last step is to make a presentation of the design that has been made. The best practice is to create several alternatives to be able to compare which is the best presentation.
The last step is to make a presentation of the design that has been made. The best practice is to create several alternatives to be able to compare which is the best presentation.
The steps above were inspired by a webinar presented by Mas Riko on 'How to Create Dribbble Preview While Ngabuburit,' if you are interested in learning it, you can play the video below👋
The steps above were inspired by a webinar presented by Riko Sapto Dimo on 'Belajar Bikin Preview Dribbble Sambil Ngabuburit,' if you are interested in learning it, you can play the video below👋
Youtube Video about How to Create Dribbble Preview
Youtube Video about How to Create Dribbble Preview