Menu Drive Case Study

Davila Woodwork Inc. is a small family owned home and business construction company based in Broward County, FL.

I was tasked with designing and building their new website to grow their brand awareness online and be a sort of reference or gallery of their previous projects. I had a blast working with Johnathan, their Social and Digital Manager. I originally was hired to fix website bugs but by the end we had a newly designed site with better UX and overall digital branding.

Focus

UX / UI Design
Branding
Webflow Development

Deliverables

Mobile App Design
Style guide with design assets

Davila Woodwork Inc.

Iphone 12 mockup image of Davila Woodwork's website project by Alberto Recio.

Davila Woodwork Inc. is a small family owned home and business construction company based in Broward County, FL.

I was tasked with designing and building their new website to grow their brand awareness online and be a sort of reference or gallery of their previous projects.

I had a blast working with Johnathan, their Social and Digital Manager. I originally was hired to fix website bugs but by the end we had a newly designed site with better UX and overall digital branding.

Focus

Web Design
Branding
Webflow Development

Deliverables

Responsive Website
Style guide with design assets

Project Summary

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Project Capacities:

4 days

Sole UX UI Designer

Started with a formal brief

Design Challenge Overview

01 Discovery

- Secondary Research
- Feature Analysis
- Market Positioning Chart

02 Define Stage

- User Persona
- Value Proposition Chart
- Task Analysis (and more)

03 Design Stage

- Site Map
- MVP
- Prototype Version 1

01 Discovery

Secondary Research

On this sprint I focused on a Lean UX approach given that I did not have much time. This is perfect for real world situations when on a product design team. I jumped into secondary research, thats mainly online research from reliable sources.
‍
Here you can see our main competitors for food delivery apps, information on user expectations like delivery time, cost and distance. All viable information to build our user persona. Here, we're gaining a better sense of our user's mental models.

When running a lean UX sprint where time and resources are scarce, I've found that extensively reading app reviews on the industry's main competitors helps construct an idea of what industry user's face and how they express their frustrations. When it comes to product design posts like this are ripe with design opportunities.
‍
Here the user focused on the delivery experience which is can be a valuable insight. Should we restrict proximity to the restaurant, should we streamline the process? All great questions to focus on in ideation.

The feature layout is built with flex, like the hero layout. Don’t like our typesetting? You can update every detail in the typography section of the Style panel.
‍
You can also add spacing between the heading and paragraph, swap a video in for the image, or add a button. Just make sure to drop your button into the div block that contains this content.

02 Define

Affinity Mapping

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

User Persona

The feature layout is built with flex, like the hero layout. Don’t like our typesetting? You can update every detail in the typography section of the Style panel.
‍
You can also add spacing between the heading and paragraph, swap a video in for the image, or add a button. Just make sure to drop your button into the div block that contains this content.

The feature layout is built with flex, like the hero layout. Don’t like our typesetting? You can update every detail in the typography section of the Style panel.

HMW Ideation

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

How Might We?

The feature layout is built with flex, like the hero layout. Don’t like our typesetting? You can update every detail in the typography section of the Style panel.
‍
You can also add spacing between the heading and paragraph, swap a video in for the image, or add a button. Just make sure to drop your button into the div block that contains this content.

03 Design

Visual Analysis

High Fidelity Mockups