Case Study - The Sandbox Project

Preview:

Citation preview

The Sandbox ProjectAline CondeBen LamKrystal Gayle

Meet Ted Teacher & caring father

32 years old

Widow, 2 kids (1 son & 1 daughter)

Family history of obesity

User goal:

Wants information

Meet Meredith Chief of Pediatric Surgery

38 years old

Married, 1 birth child, 1 adopted

Developing project with pediatric team

User goal:

Wants to get involved & become aleader within community

Meet Olivia VP of Marketing of Pampers

43 years old

Married, no children

Actively searching for emerging non-governmental organizations to collaborate with

User goal:

Wants to be more socially responsible by engaging with the community

Their First Impressions

“Bold colours”

“Friendly”

“Professional looking”

“Visually attractive”

“Congested, looks really busy”

“Social media on the side is cool but some find it confusing”

“Unsure about purpose/message of the site”

“Unclickable icons/links”

But...

What We Did

Current State Analysis

Content Audit

Organization-centric instead of user-centric

Text heavy

Repetitive, inconsistent & missing information

Outdated & irrelevant Information

Too many links & broken links

Links to external environment (i.e. third-party sites, documents, PPTs, etc)

Competitive Analysis

SBP SickKids CAMH

Use of Content ✓ ✓✓ ✓✓✓

Design ✓✓ ✓✓✓ ✓✓✓

User Experience ✓ ✓✓ ✓✓

Social Media ✓ ✓✓✓ ✓✓✓

Voice & Tone ✓ ✓✓✓ ✓✓✓

Usability Testing

Usability Testing

Task 1:Learn about The Sandbox Project and register for the upcoming conference.

Task 2:You have heard about The Sandbox Project initiatives and are interested in learning more about how obesity affects children & youth within Canada.

What We Learned

Core Issue: Inconsistent & Missing Content

What is the Young Canadian Roundtable of Health Members? Who are they? What do they do?

All links to slide decks AND PDFs

Where is the descriptive information?

What is this about?

Core Issue: Inconsistent & Missing Content

Implications on Users

● Difficulty grasping key messaging

● Unable to find desired information within the first few attempts, leading to frustration

● No visible use of consistent guidelines/structures for website content

● Lack of recognizable and intuitive language reflective of real world expectations

● Many subpages (e.g. About Us, Forms) were text-heavy and unengaging for users.

Recommendations

● Perform complete content audit in order to determine the relevant and irrelevant information

● Recreate content based on a refined content structure & guidelines to ensure consistency with content production

Core Issue: Disorganized Layout

Does not follow the “F” formation. This is distracting for the user. Where do they look first?

Why is this on this page? Is it clickable? What does this say about these corporations?

Core Issue: Disorganized Layout

Again, where does the user look first? The elements are distracting and overwhelming.

Core Issue: Disorganized Layout

Users love the agenda, however, the design is again very cluttered.

Where did the colouring come from?

Positioning of social media feed vs. recent articles

Implications on Users

● Website layout does not employ minimalistic aesthetics

● Cluttered design elements (e.g. carousels), combined with excessive use of widgets (e.g. social media feeds), were distracting for users trying to accomplish a simple task

● Users are unable to find the info they are looking for without proper layout organization and prioritization

● Loss of interest to continue exploring website

Recommendations

● Design 3 distinct portals with tailored content, catering to the specific interests of that group: 1. Public2. Professionals3. Partners

● Generalized content (e.g. About, Projects, Get Involved) that can be accessed through all pages and are applicable to our 3 target audiences

● Design streamlined layout so users will not be distracted by unnecessary cluttered content on the side panels

Tailored content

Partners Professionals Public

How to help, campaigns,

sponsor an event, donate

How to get involved, develop

projects

General information, tips, lists, recipes

Interactive content: videos, tutorials, presentations, images, infographics, etc.

Core Issue: Navigation DifficultiesNav Bar is unresponsive

Menu options are not intuitive

Too many things to navigate.

Unsure where to begin.

Very cluttered and busy.

No navigation trail & location signal.

How do we know that they received the email?

Image, not an interactive map.

Once again, why is this here? Relevance?

Implications on Users

● User experiences did not match real world expectations for a charitable website

● System status was not visible at all times, so users were not able to pinpoint their exact location on the website

● Some users were unable to distinguish between clickable and non-clickable items (e.g. icons were not clear)

Recommendations

● Create consistent and intuitive headings and reorganize the navigation bar.

● Reorganize the location of specific subpages based on their relevant content.

● Design more intuitive buttons that reflect today’s web standards.

● Create global navigation indicators to allow users to identify their relative

location within the website.

How We Can Solve It

Wireframes

Home● Refocused global navigation menu

○ Donate

○ Get Involved

■ Volunteer

■ Become a Roundtable

Member

■ Join the Community

● Introduction of theme statement

● Tailored portals

● Community forum

● Simple, clean footer

● Section for content tailored for the general public, with videos, articles and posts of the community forum

● FAQ's are main topics that users are concerned with

● When users are on a specified portal page, the navigation button will be enlarged

Public Portal

● Brief description of page's content and video with founder’s message

● Suggested new about me text

● Clicking on the arrow will update the content in the section below

About

Projects Landing Page● Subject matter is clear and concise

for each project

● Allows users to have an overview of all projects before selecting one particular

● Join the Community feature brings users to the forum to join the conversation

Projects Page Template

● Header section

○ Project Summary

○ Featured Video/Image

● Search Bar

● Tailored Content

● Low level featured area

● Three main sections

○ What’s coming Up

○ Interactive calendar

○ Past events

Events

Design Style Guide

● Branding consistency

● Implementing bold secondary colours

● Imagery guidelines

○ Public○ Professionals○ Partners

The Digital Strategy

Social Media

Our goal is to foster SBP’s social media presence to bring awareness to the need for improved child and youth healthcare policies within Canada.

+

Governance

1. Ensure consistent visuals, voice and tone across all platforms and devices (profile page, descriptions)

2. Cross-platform promotions (reuse content whenever possible)3. Embrace hashtags to strengthen SEO 4. Create collaborative campaigns with partners (ensure cross promotion)5. Take advantage of ads & promoted posts - target audience6. Engage with community in a timely manner 7. Always incorporate visual content (images & videos) and resources8. Take advantage of peak times for posting and engagement

The Community Forum

Engaging community where people can learn & share passion for children healthcare

A place for public, professionals & partners to connect and network

Account registration for added credibility, networking, private messaging

Submit, Like, Comment & Share

Community Forum

● Intuitive search function

○ topic

○ keywords

○ audience type

● Filter side panel

● Account registration & sign in

The Next Steps

Project Phases

Discovery(15%)

Definition(15%)

Iteration 1 (P1) (25%)

Iteration 2(P2) (20%)

Iteration 3 (P3) (20%)

Maintenance(5%)

✔ ✔

Research

Analyze

Synthesize

Document insights

Propose solution options

High level issues

Low level issues

Core issue: Inconsistent & missing content

PlanDesignDevelopmentTestingDeploymentDocument

Core issue: Disorganized layout

PlanDesignDevelopmentTestingDeploymentDocument

Core issue: Navigation difficulties

PlanDesignDevelopmentTestingDeploymentDocument

Project review

Report of analytics and findings

Closing documentation

SLA agreements

Conclusion

● Content/Design impact the efficiency and effectiveness of key messaging

● Our suggestions

○ Perform content audit to reveal instances of misinformation, duplication and

inaccuracy

○ Formulate content structures and guidelines

○ Design layout supports the content structure

● Opportunities to engage audience, grow following and develop your platform

Thank You!

Questions?