Design Process

1. Exploration

Refers to a phase in the design process where you actively gather information, brainstorm ideas, and experiment with various solutions.

Design Requirements Summary

• Create a Landing page for an E-Commerce website called Kelontong Nusantara.

• Users can create a new account.

• Users can check their shopping cart list.

• Users can check relevant notification.

• Users can search a specific product using specific keywords.

• There is a product category highlight section for Kelontong Nusantara listed product category (Food, Drinks, Clothing, etc.).

• There is a featured merchant section for the users to see.

• Alert section to inform the users for limited-time product discount.

Competitor Benchmark

• Tokopedia

• Shopee

• Amazon

Inspiration

• Kira Studio

• Frejus ZOTONGNINOU

2. Iteration

Refers to a cyclical process of continuously refining a design based on user feedback and testing.

Create > Test > Analyze > Refine > Repeat.

3. Responsive Test

for 1440p, 1920p, 2560p, and 3480p screen sizes.

4. Finalization

Implementing Figma Component, applying Auto-Layout, and fine-tuning to make sure the overall design is consistent.

Tools and Resources

Design Tools

• Figma

Figma Plugins

• Unsplash

• Tint and Shades

Figma Resources

• Iconsax

• Basil by Craftwork

Font

• Sen

Thank you!