Verdure
Customization Food Ordering Experience with UI/UX Principles
Date Published:
[1 min read]
The Project
To produce a functional digital prototype of a website by applying current best practices throughout the UI/UX development process.
The Process
Since this was an individual, small-scale project focused primarily on my personal learning, I chose to use the Waterfall approach to design a restaurant website.
This linear, step-by-step process was easy to manage and helped me track progress through detailed planning and documentation.

Inspired by the lush green color of vegetation, I named the restaurant Verdure. This word comes from the Old French verd (meaning "green").
Verdure is a rice bowl restaurant that offers fusion rice bowls made with alternative meats, focusing on sustainability and wellness.
With the business concept established, I crafted three distinct user personas to better understand the needs of both users and clients. These personas helped clarify the content and functionality requirements for the website.

Next, I went on to design a sitemap indicating the structure of the website's information flow. I aimed for simplicity and intuitiveness, keeping the user's journey in mind throughout the design process.

Once the sitemap was established, I created low-fidelity wireframes to outline the layout and content structure for both desktop and mobile.

Then, I envisioned the final look and feel of the site through a moodboard.

I wanted the design to evoke a sense of wellness and sustainability, so I chose a calm, mellow color scheme.
The typeface Pacifico was used for headings to create a friendly, inviting atmosphere, while DM Sans was chosen for body text due to its readability and modern feel.
Final Product
Building on the foundation of my lo-fi wireframes, I developed the full visual mockups with the moodboard as reference.
With the visuals finalized, I brought the design to life by creating an interactive prototype in Figma. This prototype simulated the user's journey on the Verdure site, illustrating how they would navigate and place an order.

My Reflection
Great web design goes beyond aesthetics—it’s about seamless, user-centric experiences.
Through this project, I learned to blend design principles with usability. Additionally, I have also explored web technologies and coding to equip me with more control over my work and gain a deeper appreciation of the intricacies behind web development.
Now, with both design and coding skills, I’m excited to continue crafting intuitive and engaging digital experiences—and always eager to learn more!