RollTech
Web Redesign for an Innovative Coffee Roaster
All Projects
Project Goals
The analysis of RollTech's current website revealed significant issues, including an outdated design, cluttered navigation, poor mobile responsiveness, limited interactivity, and poorly organized content. The main goal was simplifying navigation, ensuring mobile compatibility, incorporating interactive elements, and organizing content effectively.
At the client's request for a Japanese-style design, we integrated elements of Japanese style such as minimalistic design, clean lines, and a focus on simplicity and functionality to create an appealing online presence.
Iteration
This collaborative approach with the client helped us meet the client's expectations and exceeded them, leading to their approval of the final product. Three iterations were made and the third iteration was a combination of elements from the previous two.
Ideas
Initially, the client did not specify a preferred design style. Given that their product exudes an elegant aesthetic, we proposed an elegant design style. After presenting the initial design, the client expressed their preferences, leading us to create a second iteration based on their feedback.
The client appreciated the overall second design but requested a combination of elements from both design styles. We incorporated their suggestions into a third iteration, which the client found highly satisfactory.
Visual Design
We not only incorporated Japanese design aesthetics into our site but also used unique hand-drawn sketches to bring the site to life.
Competitor Research
Several Japanese websites were selected for their minimalistic design and innovative user experience. Through comprehensive analysis, we identified the best design elements from each site and incorporated them into our own, ensuring our design meets industry standards and client expectations.
Workshop
The workshop section introduces the strengths of RollTech's product and includes animations detailing the steps for using the RollTech coffee roaster.
Site Structure
Based on the analysis and business goals, a new site structure was developed. The original structure had several sections displaying similar content and lacked pages that could highlight their strengths.
Unique Hand Drawn
Workshop
The workshop section introduces the strengths of RollTech's product and includes animations detailing the steps for using the RollTech coffee roaster.
Result
Following delivery, the clients are satisfied with the final product. It is ready to publish on Framer, and the clients are considering hosting the website on WordPress. Our team will be responsible for transferring the design to WordPress once the clients make their decision.
.png)
Deliver in Framer
We utilized no-code AI web development to create high-fidelity prototypes, ensure seamless design-to-code transition, and incorporate interactive components. This approach streamlined the development process, delivering a polished, user-friendly product that is easy to maintain. One-click to publish if needed, saving clients time to seek web developers.
Overview
RollTech, a coffee roaster store that specializes in high-quality coffee roasting machines. They found me with a request to redesign their outdated website into a modern, user-friendly site. I was responsible for the entire design project which included: communication, research, wireframing, prototyping, visual design, and interactions.
YEAR
2024
ROLE
Lead UX Designer
