What is Everly Wedding?
Everly Wedding is a wedding planning startup that provides customized budget planning, to-do lists, and day-of wedding coordination for their clients. Everly’s wedding planning services require assembling a customized budget and to-do list for each new client, a process which typically takes two days to complete.
Our Mission
Everly asked us to design planning tools for their under-construction website. By designing an automated Budget Planner and To-Do List, our goal was to eliminate the two-day turnaround for Everly while still letting customers easily customize their own budget and task list.
As the team's Visual Designer, I was responsible for the high-definition mock-ups and redlines that would be part of our final deliverables.
Who
Everly Wedding
Where
General Assembly
Team
Me plus 3 other UX Designers
My Role
Visual Design
Timeline
3 weeks
Design Studio & Concepting
Early on, we held a design studio session with our client, so that we could quickly and easily settle on a design direction with Everly's approval. Within just an hour of sketching and presenting ideas, we knew where we needed to go!
Competitive Visual Analysis
My first task as Visual Designer was to look into competing sites in the wedding industry and analyze their use of design, color, and space. Our client had delivered us a package of extensive pre-existing design work and style guides, and my goal here was to confirm that the proposed design was suitable for Everly’s competitive space.
While I was looking at the visual design of these competitors, our Researcher was looking into their functionality and features.
Affinity Diagram
Our team conducted a series of user interviews with people who had planned weddings in the past. (My wife, who had planned the majority of our own wedding, being one of them.) We took the resultsand created an affinity diagram to determine recurring themes among wedding planners.
Personas
From the affinity diagram, we made a list of characteristics to define two personas that best represented the target users for Everly Wedding. Unusually, our personas were couples, as opposed to individuals, and the biggest distinguishing factor between them was budget: our primary couple had a budget of $35k for their wedding, (the average cost of a wedding in Seattle,) and our secondary couple had a budget of $15k, (the low end of what Everly considered their target market.)
Due to family issues our Researcher couldn't finish the personas himself, and I covered the work to finalize them. Kate and David were our primary persona, and Sarah and Kyle were our secondary.
Problem Statement & Measure of Success
Based on our research, our Project Manager crafted a problem statement to define our goal for customers:
Fast-paced couples who feel overwhelmed about their wedding planning process need to be able to customize and personalize their wedding, but are not sure where to begin the planning process.
This didn’t cover our client’s business needs, so we had some additional measures of success for our tool design:
Cut out time-consuming client prep on Everly’s end.
Increase Everly’s client capacity.
Gain trust and brand recognition in the marketplace.
Proposed Solution
Our proposed solution was in line with what Everly requested: to create interactive, customizable wedding planning tools for Everly customers. These tools would focus on:
Customization & Interactivity: Use an intuitive drag-and-drop interface to let customers set up their wedding plans to fit their needs.
Messaging: Make it easy for customers to ask questions for Everly wedding planners, and receive timely answers.
Recommendations: Have Everly’s original planning recommendations always readily available for customers, even if they overwrite them with their own changes.
We would focus on creating the budgeting tool first, though in the end we were able to make progress on the to-do list tool as well.
Style Guides &
Mood Board
Everly provided us with a materials package that included plenty of previous design work for their website, including some style guidelines. Since some of my work there had been done for me, I went right to making a set of guides that included UI elements that I’d be able to use in the eventual final mock-ups.
I also assembled a mood board using some of the materials provided and some of my own image research. While much of this style didn’t end up making it into the final visual design for the planning tools, it remains relevant for the rest of the website.
Click through the carousel at right to see the mood board and style guides.
Early Mock-Ups & Iteration
With the materials provided by Everly allowing me to complete the visual planning for the project sooner than expected, I moved into mock-ups early on, before wireframes were finalized. This let me repeatedly iterate on the visual design while the wireframes were being subjected to user testing.
Our Interaction Designer had used a frame to contain the UI elements of the tools, and I explored different ways of representing that frame, both invisibly and explicitly.
Final Mock-Ups
My final mock-ups went in a somewhat different direction than previous versions, as I'd settled on a less visually elaborate style. Since we were designing tools, first and foremost, I wanted to do away with distractions for our users like Kate and David. That included cutting the elaborate, advertising hero image in favor of a flat-color header that was more tutorial-oriented. I also replaced the paisley pattern on the frame with that same flat color.
Redlines
In the final week of the project, with mock-ups finalized and work on our presentation beginning, I created a complete set of redlines for our client. As I work on a PC and use Figma instead of Sketch, I unfortunately didn’t have access to the Sketch plug-ins that might make this task something less than the grueling chore it ended up being. Fortunately, our client appreciated the effort!
Next Steps
For continuing on this project, (as our client, Everly, obviously is,) we recommended prototyping and user testing the To-Do List, to get user feedback on it, before iterating and finalizing it.
Also, as we didn't have the time necessary to move on to the Day-Of Schedule Planner, that would happen once we were satisfied with the state of the To-Do List.