OKLAO Coffee:
Rebranding + E-commerce Web Design
OKLAO Coffee:
Rebranding + E-commerce Web Design
Rebranding + E-commerce Web Design
- Welcome to OKLAO, a branding redesign and demonstration of various web development technologies and features combined to create an e-commerce platform.
My Role
Brand Designer
UI Developer
Brand Designer
UI Developer
Design Tool
Figma/ illustrator/ photoshop
Figma/ illustrator/ photoshop
Development Tool
React.js / Next.js/ Express.js / Firebase / Firebase Authenticatio / Firebase Storage / React-Dom / Stripe API
React.js / Next.js/ Express.js / Firebase / Firebase Authenticatio / Firebase Storage / React-Dom / Stripe API
The project scope covered two aspects,
including and Brand design and Web development.
Please click the sections below to explore each component in detail.
- Section ①
Brand Design
- Our goal was to create a dynamic atmosphere and attract younger customers to Oklao, a Taiwan-based coffee brand. To achieve this, we focused on designing a modern and energetic visual identity that would resonate with this demographic.
![](https://freight.cargo.site/w/889/q/75/i/f868dda903bd9c899a721ea214237734c87850eb9c477c359b5bbf1fbfc559b2/oklao-original-logo.png)
![](https://freight.cargo.site/w/1000/q/75/i/289b978422d3084c76f1706456125da76c95471ca13ceb1612170143b2fe15bd/-2024-05-22-2.29.34.png)
![](https://freight.cargo.site/w/1000/q/75/i/3e1e2b5c240ba92aba60c5a187a44c72dcea6805e10c7ca05143a3b9551e3a78/-2024-05-22-2.30.08.png)
Website and Logo before
Research
Market Analysis:
Customer Surveys and Trend Studies:
We conducted surveys and focus groups with potential younger customers to gather direct feedback and analyzed current design and lifestyle trends to identify key elements that resonate with this demographic. Key findings included:
- Visual Appeal:
- Younger consumers are attracted to brands with a strong, modern visual identity. Bright, vibrant colors are more likely to catch their attention and create a lively atmosphere.
- Social Media Presence:
- An active and engaging social media presence is crucial for connecting with this demographic. They appreciate brands that are visually consistent across platforms and enjoy interactive brand experiences, whether through social media, in-store events, or digital engagement.
Design
- Armed with these insights, I set out to redesign Oklao’s brand identity to better attract younger customers. Our approach included:
- 1. Logo Redesign:
- Creating a modern and dynamic logo that reflects Oklao’s energy and appeal.
- 2. Color Palette:
- Developing a lively color palette that conveys energy and freshness, appealing to the youthful market.
- 3. Typography Selection:
- Choosing typography that is both stylish and readable, aligning with contemporary design trends.
4. Brand Pattern:
Establishing a cohesive brand style that ensures consistency across all touchpoints, from packaging to social media.
Establishing a cohesive brand style that ensures consistency across all touchpoints, from packaging to social media.
- By focusing on these elements, we aimed to create a brand identity that not only attracts younger customers but also fosters a lasting connection with them. The new visual identity of Oklao is designed to be vibrant, engaging, and reflective of the values and preferences of the modern coffee consumer.
![](https://freight.cargo.site/t/original/i/d38015768c1d6901b4e05441d93ace5c640cb1e243af6f85b2893cee5344b247/03-Free-Enamel-Mug-Mockup.jpg)
![](https://freight.cargo.site/t/original/i/2edf9eb92746c3b3dd7a0abdd8fc87b63665d113e06ceba3497610e4d7588e74/PaperBag-Unmark_2000.jpg)
![](https://freight.cargo.site/t/original/i/6b85c394374b0a029905ca0acc012a97dba0ff5593ad4296eb5de571010e7e1a/oklao-animal-package-64.jpg)
![](https://freight.cargo.site/t/original/i/0087e3374680bdea3942ce05ba43fbc8dd9f7091d3b5fe326d7e23c07a8c7c02/oklao-animal-package-63.jpg)
![](https://freight.cargo.site/t/original/i/52d96c20d37294f2f865b48c7fdc87d4a87ca64be1c35b266a2c39cf0d97c894/oklao-animal-package-62.jpg)
![](https://freight.cargo.site/t/original/i/cec02650c69aea41c01597a9c9077dd8c874065bbca451f8b43d4c38047c1038/oklao-animal-package-61.jpg)
![](https://freight.cargo.site/t/original/i/8ae60220171df46c4671929461aa4cbb4dabf06af4132e48697ff6dc55d6d3d6/oklao-animal-package-60.jpg)
![](https://freight.cargo.site/t/original/i/96b44a54087152eb333c8ff0282fe8e4fd63455ffb33e0c6a860ca000df5afce/oklao-animal-package-59.jpg)
Click the button below to switch the other part !