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