JAVA BEAN WEBSITE
BACKGROUND
Founded just under three years ago, fictitious Java Bean is now a bustling cafe. With its high ceilings and “found space” appeal, the cafe has come to host exhibitions, meetings, & local bands. It has become an integral part of the arts revival community that has taken root in the old factory mill buildings along the river. JAVA BEAN features an extensive menu of coffees & coffee drinks, including smoothies, frappes, & alcoholic coffee specials, to cater from the morning early bird, to the relaxed evening crowds. The owners take pride in their community, striving to provide a creative space with gourmet coffee, tantalizing baked goods, & entertainment to inspire the artist’s soul.
PARAMETERS
SKILLS:
Adobe Dreamweaver, Adobe Illustrator, Adobe Photoshop, Balsamiq
FOCUS:
HTML/CSS, Branding, UX Design
CLIENT:
GRA451 Advanced Multiplatform Design
CONTACT:
Professor Heather Boswell
PROJECT DATE:
2023
PROJECT URL:
PROBLEM:
Create an initial website for fictitious start-up, Java Bean, from previous branding project (Java Bean Branding project.)
TARGET AUDIENCE:
Offering adult beverages, Java Bean attracts a 21 & up crowd; however, it also is family-friendly. A trendy place you can meet for lunch, or the occasional, artistic live event.
CONSTRAINTS:
Turn around time for web project was roughly six weeks & included creating all branded imagery.
MY ROLE:
Responsive wireframes for desktop, tablet, & mobile breakpoints, code writing & editing to transform wireframes into actual site, imagery per branding guidelines, mock-ups (as needed), taxonomy for the site, & contact form code writing / editing
TASKS:
Initial audience & content analysis, wireframes for main pages & contact form made in Balsamiq, initial prototype in code (Adobe Dreamweaver), & completed website, uploaded to domain by use of an FTP client. All imagery was composed for the project, via Adobe Photoshop or Adobe Illustrator.
DESIGN RATIONALE:
Since project started with new branding & a logo, color selection included the colors of coffee beans, coffee with cream, & red / yellow (colors that tend to make people hungry.) These hues were chosen in warm families, as the atmosphere of Java Bean is warm & inviting. The website centered around these colors & concept.
PDF JAVA BEAN BRAND GUIDELINES
KEY TAKEAWAYS:
Designing a website from the beginning to reality requires timing, balance, & continual schedule adjustments. Writing & editing code requires taking breaks when things seem dire, to refresh the puzzle-solving areas of the brain.
Evaluating a website for continual brand adherance allows for a stronger presentation of the brand and inclusion of the brand's ideal user by way of understanding the brand's vision better.
In future upates to the site, better accessibility would be to remove some verbiage from images for those who cannot see due to vision impairment. Adjustments to the size of the hero banners may be optimal, too.
SPECIFICATIONS
The logo for this project was created prior to the website. The color family was selected to coordinate with HEX values #211E1E, #4C2110, #825534, #F5BA79, #EA2427, & #762130. The font family Poppins was chosen for its cleanliness & ability to feature several weights for emphasizing. The client specifically requested a feel in line with these HEX values and the font family, as were previously defined with the creation of the new branding & logo. An image library was created via photoshoots in the locations, as well as stock photography chosen for its brand-defining character. Mock-ups were created as necessary for the store items.
