I worked together with my UX team in collaboration with a development team to redesign an Italian restaurant website. Together we used various UX research, visual design, and development tools to come up with a final, visually pleasing version of the site.
For this project, I was primarily a UX/UI Designer, Content Designer, as well as UX Researcher.
Jasmine Carpentier, Anum Hassan, Misha Kessler, Christopher Motalbo, Christine Wong, Helena Yau
Zeplin, Sketch, InVision, Trello, Keynote, Slack
We chose Cara Mia because not only was it a healthful, family-oriented establishment, but its UX and UI were very out-dated, with various glitches and anachronisms, which we felt that we would be able to fix well.
Our goal was to create a website with the restaurant's feel of tradition and high-quality food, in a way that reflected current UI trends and design expectations.
We looked at various other Italian restaurant businesses and their websites, to see what current design trends were, and what the conventions for this niche were. For example, an eye-catching hero image that represents the food at the restaurant as well as strong Call to Action (CTA's) buttons were key.
Based on our competitor research, we worked as a UX Design team along with the development team to create sketches on paper of what the website would look like. We wanted to include everything on the website on the home page for ease of use.
We talked about the menu, which was very long. We wanted to create a parallax where you can scroll within the page through the menu.
We also wanted to preserve the previous site's family-oriented feel. As a result, I edited and re-wrote their About Us story, and we included pictures from the restaurant's past.
The original site had both an outdated UI and UX. For example, the color scheme needed a simpler and more direct trajectory. Another example is that there were too many confusing and overwhelming sections to the site, from the double rows for the menu to the side bar asking to sign up to the mailing list.
HI-FI DESIGN AND QUALITY ASSURANCE
Keeping our design studio and competitive research in mind, we jumped to creating some high-fidelity wireframes for desktop, tablet, and mobile view.
We used Zeplin as a hand-off tool, giving the development team access to the fonts, font sizes, color codes, and code for each item in the designs.
After the development team coded the designs, we performed a round of Quality Assurance (QA), testing for any glitches and errors, making sure that the final product matches the original design, and that the site is responsive.
Our final product took into consideration all of the points discovered in our QA.
Sophia Furman - UX Designer and Strategist
Feel free to reach out to me at firstname.lastname@example.org, or, just fill out the form below.