happyhour
App Design and Development
Summary
happyhour is a responsive web app designed to help drink enthusiasts find and catalogue notes about their favourite recipes.
Timeline
November – December 2023
Role
Lead Designer and Developer
Tech Stack
Adobe Photoshop
React framework
Link
Visit happyhour
Concept
Concept
The design of this web app focuses on clean, fun, and lively emotions reflective of the types of drinks viewable on the site.
On the development side, React javascript framework was used to build a project with efficient code that gathered and saved data with minimal obligations from the user (e.g., using local storage as opposed to user login validation).
Colour Palette
#FE9983
#B3E0A3
#FABD87
#E3E3E3
#292929
Colour Palette
A variety of bold colours were chosen for happyhour's colour palette to elicit feelings of joy with a subtle tropical mood.
With such bold colours comes the potential for visual overstimulation. The muted quality of these colours along with a primarily white background allows for use of these playful colours while avoiding mental strain.
API & Functionality
API & Functionality
Using React javascript framework, data on all of the drinks shown (e.g., drink image, name, ingredients) were pulled from an open-source API. Then, the data was to piped data into components so that each drink page held a consistent layout.
The app includes a notes section in which people can write, save, edit, and delete notes on each drink page. This notes information is saved on the individual's computer using browser cookies so the notes could be saved and accessed across browsing sessions.
