top of page

 

Happy Lemon's current website

HAPPY LEMON

To practice and advance my skills in HTML/CSS and design, I decided to redesign a website that with faulty design. Happy Lemon is a Taiwanese milk tea franchise, with a logo that is a fun and cute lemon head which creates a more youthful and energetic branding.  However, Happy Lemon's website does not reflect that. The current website uses a mundane and default typeface on the navigation, which also brings no branding that compliments the brand's logo.  

Initial comps of the home and contact page; keeping to brand's color by using the burgundy red

The final redesigned home page, with an additional three pages for menu, locations and contact

Text shadow allows for subtle contrast for white text on the yelllows of the background, and a hover with red to maintain branding to Happy Lemon

DESIGN

The creative process starting with me brainstorming and defining what I wanted the outcome to be when users interact with this site.  Because most of Happy Lemon's customers are young adults, it was important to design to that market.  The initial comps allowed me to see what it was I was brainstorming onto a screen and see what need to be edited. The comps also helped in breaking down each element of the code, from the <table> to the <footer>, making it easier to write the code.  Colors were chosen based off of the Happy Lemon's logo to keep branding consistent, as most buttons has the burgundy hover.  A sans-serif typeface reflected a more youthful vibe, compared to the serif in the original website.

CODING

This project allowed to grow my skills in HTML and CSS as I set out to learn new elements, attributes and values.  Some of the new elements I learn include <table>, text-shadow and positioning.  Learning more minute details to add into my CSS allowed me to add more thought and intent behind my designs and make them more interactive with users.

TOOLS

HTML/CSS, Photoshop

bottom of page