Swirl McGarryBowen

Redesigning Dole.com

Bringing a fresh new approach to Dole Foods

Business goal

Create a single platform for Dole's websites. It needed to reflect the new branding and serve up a best-in-class, industry-leading experience that met consumers where they are.

Two things were important for the key client stakeholders:

1. Showcase recipes and lifestyle tips written by in-house nutritionists
2. Educate consumers on farming practices and community outreach

Company
Swirl McGarryBowen
(Client: Dole Foods)

Role
UX Designer
UX Researcher

Website
www.dole.com

Platform
Web

Year
2018

Research

Audit existing websites

To start the redesign, I audited their existing web properties:

1. Country websites: 3 in North America and 8 in Europe
2. Dolecrs.com: information on their corporate responsibility and sustainability
3. Doleorganic.com: information on their organic farming practices and farms
4. Disney microsite: highlight Disney-Dole products, recipes, and contests

Key takeaways

After reviewing all the websites, three things stood out to me:

1. Information spread across different websites.
   Dole has websites dedicated to farming practices and community outreach programs. This information is not found on their country websites.
2. Mosaic layout makes it difficult to navigate site.
   The layout lacks structure which impacts discoverability. This makes the visitors rely on the navigation to get around the website.
3. Inconsistent regional websites.
   The lack of cohesion impacts Dole's ability to show they are a global company.

Review Google Analytics

Next I dove into their Google Analytics (GA) data. The goal was to get a better understanding of user behavior on the existing websites. The key things I looked at were:

1. Top entry pages
2. Top pages viewed
3. Top page paths

Key takeaways

After reviewing the GA data, I uncovered a few things:

1. Home and recipe pages were the top entry, viewed and included in the top paths.
2. Recipes, in general, were the top viewed pages
3. Facebook, Pinterest and emails were top drivers to the recipes

Interview consumers

I interviewed people to understand consumer needs and concerns. Since we didn't have a budget to do research, I recruited co-workers who were not working on the project. I wanted to find out:

1. Their eating and grocery shopping habits
2. Their motivations for what they decided to buy and eat
3. The usability of the exiting Dole website

Key takeaways

1. People have different eating habits.
   Most people didn't want to spend lots of time making food. Some wanted to eat healthy, while others did not.
2. People have different grocery shopping habits.
   Some people only shopped at chain groceries and others at farmer's market. Some even had food delivered.
3. People with families cared more about what they bought and ate compared to single people.
   Families cared whether the food was organic, non-GMO, gluten-free, etc.
4. People want to know where their food came from.
   They wanted to know if the food was grown nearby or shipped from out of state.
5. The website is overwhelming.
   At first glance people liked the amount of photos. When it came to navigating the website it became a hinderance. For example, people had to rely on the navigation or search to find a certain product or recipe.

Develop personas

I worked with the content strategist to develop personas. The personas guided the redesign and I used them when writing a screener for user research.

Competitive Analysis

Next I evaluated the websites of competitors and companies outside of the industry.

For competitors, I focused on:

1. How they talk about farming practices
2. Details on product pages
3. Information architecture like the product categories

I also looked at companies outside the industry. Since showcasing recipes was important for the client, we looked at recipe websites. In particular we looked at the structure and layout of recipe pages.

Testing concepts and ideas

I created modules based on the research. I wanted to visualize the new content in context. The modules centered on:

1. Explaining the farming practices
2. Telling the product journey
3. Providing ideas on how to use products

I created a prototype with the modules and set up a remote usability test. I wanted to know:

1. Does the content resonate with users?
2. Can users navigate to the different modules?

Key takeways

The results of the testing was positive. The content was useful to users and they were able to complete the tasks.

Defining the problems

Based on our research, we identified key problems to solve:

1. Website does not provide details on business and farming practices
   
2. Website does not provide the expected nutritional and product information
   
3. Website does not provide a cohesive global experience and messaging
   
4. Website is not have a clear layout and site structure

Design

Validating sitemap

The sitemap was straightforward but we had trouble with the product categories. We were unsure about produce that could be in two categories. For example, would people expect to find “Arugula” or “Spinach” in a Vegetable or Salad category. Both products were in the Salad category in the existing sitemap.

To help figure this out I set up an open card sort using Optimal Workshop. It turned out that people sorted close to the existing sitemap. As a result, we did not change the categories.

Weekly sprints

We scheduled weekly sprints for each major part of the website:

1. Navigation
2. Recipe
3. Company
4. Product
5. Blog
6. Corporate responsibility
7. Home

For each sprint, I did the following:

1. Audited other websites to generate ideas
2. Created a few concepts
   
3. Picked one or two concepts to prototype
4. Run remote unmoderated usability tests
5. Reviewed the findings with the client

Solution

The redesigned website addressed the problems that we identified, specifically:

1. Bring content from other Dole-owned websites to explain how Dole invests in not only the farms, but also the workers.
2. Provide a layout with pathways into sections for content that consumers are looking for or may be interested in
3. Create a consistent design that is adaptable for different languages and regions.

New top-level pages

Redesigned the main pages for each section with the following goals:

1. Use cards to showcase site sections
2. Utilize tabs to organize pages with multiple child pages
3. Use brand colors, icons, and photo style

Left to right: Home, Recipes main, and Chopped Salad pages

Farm section

Provide a place to talk about the business and farming practice as well as the community outreach. 

New drop-down navigation

Revised the categories based on what content people were viewing (GA data) and looking for (consumer interviews) and added new ones to talk about business and farming practice ("Farms", "Farm Finder") and tips and articles on healthy living ("Blog"). 

New modules to highlight site sections

Created reusable modules that showcase:

• Product related recipes
• Suggested recipes (e.g. Thanksgiving or 4th of July recipes)
• Latest social media post
• Banner promoting Farm section
• Product FAQ
• Product How-to (how to pick cherries, how to cut a pineapple)
• Latest healthy living articles by category
• Suggested product (e.g. seasonal or regional fruits)

Disney partnership

For each major movie release, there was a tie-in with Dole. In stores they had, for example, Star Wars-themed salad packs or Lion King pineapple tags.

I designed a template for the Dole-Disney partnership. It showcased Disney-themed recipes and contests.

Outcome

The redesign was delivered and approved by the client. They are currently transferring the content to the new design.

victor@iamvictorlin.com