FARM TO TABLE TOURS
User Research, Information Architecture, Wireframing
Project Overview
Farm to Table Tours had an incomplete website that they didn't feel comfortable promoting, despite the fact that they had scheduled tours (with no customer bookings yet) in France coming up soon. We had to get an MVP that took into account user needs out-the-door in a short time frame.
​
Tools
-
SurveyMonkey
-
UX Research Tools- affinity map, user journey, empathy map
-
Persona template
-
GlooMaps (sitemap tool)
-
Pencil and paper
-
Sketch
-
Custom CSS
-
WordPress
​
Process
-
Discovery Session
-
Card Sorting
-
Competitive Research
-
Content Analysis
-
User Research- survey construction and data analysis
-
Affinity Mapping
-
Persona building
-
Empathy Mapping & User Journey
-
Site Mapping
-
Wireframing (hi, lo-fidelity)
-
Content Inventory + Copywriting
-
Prototyping in WordPress
-
In-Person Usability Testing
-
Iteration based on feedback
-
Launch site build
Current Stage:
11. Content inventory + Copywriting
​
​
​
​
DISCOVERY SESSION
My first step was leading a Discovery Session with the owner of Farm to Table Tours to discuss the following:
​
-
Metrics of success with the project - what were our goals?
-
Creative considerations- images, copy and branding
-
Desired look and feel of site
-
Marketing efforts underway to reach users, and ideas for new strategies
-
User personas and any research conducted already on potential customers
-
Cart sorting with current site structure (This exercise allowed us to better visualize top-level navigation items and copy that could be integrated from particular pages to other sections of the site)
-
Project dependencies, company structure and stakeholders
​
We developed a project plan and laid out deliverables at key stages of our process.
​
​
Farm to Table Tours Homepage, Before and After Redesign
Problems to Solve
Incomplete, Placeholder Website
We needed to build a customer-facing website that was appropriate to utilize for marketing efforts and getting the word out.
Website Stalling Marketing Efforts
Farm to Table Tours already had tours scheduled in France but no customers booked yet. Marketing efforts were limited to developing a Facebook page. Further website development was stalled due to waiting on booking functionality with FareHarbor.
Missing Copy, Imagery, Booking Information
The website as it currently stood was incomplete and not presentable for prospective customers booking an expensive tour. The look and feel was also outdated and copy, specific imagery, dates and pricing were missing. All of this information needed to be on the site in a branded, audience-driven manner in order for customers to book a tour costing roughly $6,000.
​
​
​
​
​
​
-
We wanted to provide enough information to engage customers so that they would provide a deposit for a trip. Further information (like extremely detailed tour itineraries, interactive content, newsletter, etc.) could be emailed personally through a regular marketing campaign after booking. This would build brand loyalty and further entice customers.
-
We wanted to carefully select the type of information we presented on the website, to avoid cluttering and maximize white space for a minimalistic, professional look and feel.
-
Since so much copy needed to be created, we also needed to gain a better understanding of our potential customer base, and determine the tone and voice to use while copywriting. We would accomplish this through user research.
​
Our research goals were closely aligned with our project goals.
​
-
Learn more about our target audience
-
Determine what information is necessary to put on the website to have them make a decision about going on an international farm-to-table tour
Project Goals
​
Current Site Map
​
To further understand content and structure needs, we developed a sitemap representing the current site. It was clear that content needed to be developed and that we had a lot of work to do!
​
​
​
​
​
​
Competitive Research + Feature Review
Our next step was to review competitors offering similar Farm-to-Table type tours in France. We focused on the following:
​
​
We also analyzed other reputable tour sites to review features, branding and copy:
​
​
We saw many themes across these sites, and we also noticed that many sites were busy and had a lot of information about the tour to consume before booking. We wanted to make sure we balanced information with site aesthetic goals- clean, professional, expert, minimalistic and to-the-point.
​
Homepage Themes Across Sites
-
Hero image on homepage with search feature or CTA
-
Overview of company and offerings
-
Grid module with possible tours and prices
-
Company values
-
Testimonial banner
​
Tour Page Themes Across Sites
-
Hero image of tour
-
Overview of tour with quick-to-read highlights
-
Itinerary summary day by day with dropdown menu
-
Accommodation details
-
Guide biographies
-
Detailed itinerary available via email
-
Dates and prices
-
Map of tour location/s
-
Activity level required for tour
-
What's Included?
-
Photo gallery of images submitted by past participants
-
Review module
-
Related Trip module at the bottom of the page
-
Book Now/Reserve CTA
-
Newsletter CTA
-
Easily discoverable contact information
​
​
​
National Geographic Expeditions, Example
User Research
We had an idea of prospective customer base (English-speaking, experienced travelers, want small group atmosphere and free time with a tour, interested in meeting other people, ages 30-55, curious and sustainability-focused "foodies").
​
Despite this rough persona (my client had conducted interviews on general desired tours in the past during company conceptualization phase), we needed to conduct UX research in order to understand more about our target audience. This information would inform our design, tone/voice for copywriting and the content we chose to put on the website.
​
Hypotheses
We believe that our users prefer DIY, intimate tours. We believe that our users are seeking logistical guidance for tour experiences but are experienced international travelers. We believe our users enjoy connecting with other people and building relationships. We believe our users support small farms and producers, and value ethical food production and sustainability.
​
Research Goals
Learn more about our target audience & determine what information is necessary to put on website to have them make a decision about going on an international farm-to-table tour.
​
Recruitment
Farm to Table Tours Facebook page members; experienced travelers of expected age range; participants previously contacted through interviews
​
Method/Tools
SurveyMonkey, mixture of qualitative and open-ended qualitative questions
​
​
​​
Collaborative Data Analysis
As a team, my client and I started to analyze the data (total of 32 respondents) we collected. This partnership allowed us to come to conclusions and consensus collaboratively about the kind of content that would be important to add to the site.
​
The first step was affinity mapping, in order to code for themes and common patterns in the data. We wrote all data points on post-it notes and then grouped them based on similar categories. This exercise allowed us to see repetitive concerns, suggestions, and general information to consider for the site during our redesign and copywriting.
​
​
Key Findings
​
-
Respondents are extremely comfortable traveling internationally, and more likely to book a trip as a couple or with a small group.
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
-
Most people found out about Farm to Table Tours through a friend, family member or Facebook.
-
Mobile pages need to be overhauled, respondents expressed issues with mobile view.
​
​
​
​
​
​
​
​
-
Respondents chose specific tour companies because of trust in expert guidance, handling of logistics and flexibility of packages.
-
Tour options, dates, prices, locations, accommodations (itinerary), packing list, activity level required, past participant testimonials and quick-to-read highlights are priority pieces of content for tour information available on the site.
​
​
​
​
​
​
​
​
​
​
​
​​
​
​
​
"Website is not optimized for mobile phones. It comes in too big and hard to navigate."
"The location and dates were intriguing...I hope to see more photos of the tours and some testimonials."
-
Relevant photos of actual trips are critical for enticing customers.
-
Policy information needs to be added to the site (warranty, medical insurance, cancellation, customer service contact for questions, payment methods accepted).
-
62.5% of respondents would pay between $2,000-4,000 for a trip such as one offered by Farm to Table Tours.
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
-
96.88% of respondents are interested in region-specific food history and traditions, 75% of respondents reported being interested in local, organic food production. 59.38% are interested in the preservation of traditional farming practices, 59.38% are interested in sustainability.
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​
​​
-
Respondents would want follow-up information provided via email after booking a tour. Follow-up information includes:
-
Detailed information on farms and relevant historical information on locations on itinerary
-
Suggested further learning (videos, books, websites, classes, etc.) ​
-
Guide names
-
Other group participant information (age, name, email)
-
Weather updates
-
Local news, current events
-
Currency information
-
Vaccinations needed
-
Logistics (where to meet, what time, free time for planning activities outside group, specific hotel info)
-
​
​
​
​
​
​
​
​
​
​
​
​
​
​
"It would be nice to have a little info on other participants- maybe an intro that says who they are and what they are looking forward to."
Persona Building
After immersing ourselves in the data and finding common themes, we were ready to build a persona. This persona would be our main target audience.
​
​
​
​
User Journey and Empathy Mapping
Next, we went through a combined user journey mapping/empathy mapping exercise. We examined the booking flow, paying special attention to the UX of FareHarbor's booking integration. This process was very fruitful, and we accomplished numerous results:
​
-
Organizing step-by-step experience of booking a tour, through a user-first lens
-
Helped us to better determine site map
-
Considered how a user would feel at each step of the booking process, and what could be potential pain points/moments of pleasure
-
Postulated features or copy decisions that could counteract pain points that users could experience
-
Developed a longer-term list of nice-to-have features that could be implemented in a future design iteration, after release of MVP
-
Photos of actual tours​
-
Testimonials
-
Chat feature for improved customer service response times
-
Blog and other interactive media from actual tours available on site
-
Site Mapping
Our user journey mapping led naturally to us better determining our site map. We started by sketching ideas for the site map on a whiteboard, and later translated those ideas into a site map developed through GlooMaps. We were getting closer to the build phase!
​
​
​
We had to consider the complexity of the FareHarbor flow and possible duplication of content on both the WordPress site and the FareHarbor component. We settled on a solution that allowed users to book online directly entering into the FareHarbor flow with a top nav item "Book a Tour." Users could learn more detailed information about the specific tours by reading the WordPress pages on each specific tour, which would contain a more detailed itinerary and allow them to enter the same FareHarbor booking flow through a Book Now CTA available on the individual tour pages.
​
​
​
​
Wireframing (Lo and Hi Fidelity)
Next, I developed lo-fi wireframes using simple pencil and paper of all key pages not included in the FareHarbor flow. In the lo-fi wireframe, I started off with a basic content inventory and highlighted elements that needed copywriting. I wireframed the following pages:
-
Homepage
-
France Overview page (as template for all overview regional tour pages)
-
Tour-Specific page- Bordeaux (again, as a template for all specific tour pages)
-
About
-
Contact
In order to better iterate on the design after client feedback and include all proposed content clearly in the artboard, I created hi-fi wireframes in Sketch.
​
​
​
​
​
​
​
Lo-Fi Wireframe Examples: Homepage, France Overview Page and Tour-Specific Page
Hi-Fi Wireframe Examples: Homepage, France Overview Page and Tour-Specific Page
Content Inventory
Since we were building this site from scratch, in order to better allow my client to visualize and keep track of content that needed to be created, I did a content inventory for each page. Most copywriting will be handled by a dedicated copywriter. Here are two examples:
​
Homepage Content Needed:
-
Images of France and Seattle tours
-
Tagline for hero rotating banner
-
Testimonials
-
Mission and values copy
-
Legal, terms and conditions, policy info in PDF format (cancellation, warranty, travel insurance, payment methods accepted, etc.) - this will need to be a separate page linked in the footer and Contact page CTA
France Tours Landing Page Content Needed:
-
France specific imagery
-
“The French Experience” - copy on traveling with FTT in France + tour offerings
-
Tour specific thumbnail imagery- Bordeaux, Paris, Loire Valley
-
Key itinerary bullet points for each France trip
-
Dates and finalized prices
​
As part of this content inventory, I also developed a simple product roadmap, with high to low priority items from left to right.
​
​
High Priority Features
Lower Priority, "Nice to Haves"
Iteration 1: Updates to Site Map and Wireframes
My client and I met to review my content inventory, proposed site map and wireframes.
​
Wireframes were mostly approved except for one quick edit to the Seattle tour page, omitting mention of AirBnB on the site. We confirmed that users would be taken through the FareHarbor flow for booking a Seattle day tour, just like France multi-day tours.
​
However, we updated the site map significantly. We decided the "Book a Tour" link in the top nav would take the user to a comprehensive list of all tours offered, separated by France and Seattle headers. Each tour would include a photo, short blurb, and a Book Now CTA. This Book Now CTA would take the user directly to the FareHarbor tour detail page. We decided this was the quicker, less complicated way for a user to book a tour if they already had the tour in mind and were revisiting the site to book. Instead of having to go through the Seattle or France overview page, they could skip directly to the specific tour they wanted to book.
​
​
​
​
​
​
​
