Happy Doudous eCommerce & Brand Identity Design



UX & UI Design
Brand Identity Design





Happy Doudous is a stationery boutique brand that provides preschool methods and life skills for children. This project includes an eCommerce website and a Brand identity.


Happy Doudous were primarily focused on an eCommerce platform using WordPress builder. The client needed visual simplicity, flexibility for her content, and a website they could invest more time in scaling rather than fixing in the future.



The biggest issue for us to go into the project was scope so we needed to be resourceful with how we gonna focus on our time. We were happy to prioritize focusing on basic core eCommerce features that would meet the client's needs.

Style boards

The client and was also looking for style guidelines on a logo, and a font type. The exploring style guideline played an essential role in both web and print collaterals.


New visual language/Patterns

Hand-drawn illustrations seem to be the best approach to deliver a meaningful and clear message to the audience. Colored geometric shapes will assist and support these visuals to add more value to the brand identity.

  • Content-driven visual Identity
  • Feel-like-Home Vibe
  • Simplicity and Intuition
  • Adapted for children and family


The pattern created comes from Montessori’s geometric sharps.

Patterns that will play the decoration role to support Communication design (Social Marketing Design) and E-commerce website for Happy Doudous’ customers and users: To be organized with their shopping experience. We can associate these patterns
 to visual materials(product) for Happy Doudous.



Happy Doudous' logo is the initial point of identification. This is generally the first element that clients come into contact with and will ultimately align with the brand. The shape of the Happy Doudous logo refers to several aspects related to the brand. It originally presents doudous (dolls) / family / doodle. This is a reference to the brand name. Doudous is a reference to soft dolls to play with and happy feelings. It is also a symbol of family members. If we focus on the graphic form and hand-writing, we can see such elements as a doodle that children draw to play. The combination of these elements perfectly identifies the Happy Doudous brand.


Design System

Happy Doudous were seeking a kid's feel on the typeface. After multiple tries of changes, we landed on TOMO Fango - scissor cut feel, and childish and Montserrat - the simple and readable.


The Scheme

From the Landing page to complete your payment. In order to design the best eCommerce experience, creating a site map was useful to get a detailed view of the user flow and examine what happens during each step during their journey.


Grid & Layout



Before designing the UI, I created wireframes to test them on a few target users. In order to design the best eCommerce experience, creating a site map was useful to get a detailed view of the user flow and examine what happens during each step during their journey.


User Interface Design

Easy to access

This shop page designed to provide easy access to customers/users' needs to make a purchasing decision- from this shopping list and price to pay. 



Happy Doudous provides flexibility and efficiency for users. Rather than looking at the detail of each product, the customers can quickly add items to the cart in the shopping list. And the cart on the navigation bar has the touch which is used to make the core actions of the cart category. See how the user can perform the core (check shopping list, remove selected items, view cart, checkout) by using the placement of the mouse on the web/ touch in mobile phone.


Order Tracking

Happy Doudous provides order tracking for users to easily download digital products and manage their order history. From the business perspective, it gives users to directly purchase their previous shopping list via simply clicking the button- Order again



Critical feedback from the early stage 

Sometimes, clients often don’t know what they really need. Before developing a design in WordPress, showing the design in detail is essential to get important feedback during the workshop. This could also save budget because a designer can quickly change design elements from the early feedback of a client so easy to show our direction we’re going.

Back to top Arrow