Website Design Booklet

EXTREMITI3D WEBSITE DESIGN

CONTENTS THE MISSION 01 PERSONAS 03 INTERVIEWS 05 SURVEYS 07 COMPETETIVE ANALYSIS 09 USER GOALS 11 CONTENT STRATEGY 13 SITEMAP 15 TASK ANALYSIS 16 USER FLOWS 17 MINIMUM VIABLE PRODUCT 19 SWOT ANALYSIS 21 LOGO DEVELOPMENT 23 SKETCHES 25 WIREFRAMES 27 LOW FIDELITY PROTOTYPE 29 HIGH FIDELITY PROTOTYPE 31

THE MISSION

Extremiti3D is a company that specializes in 3D printed lower limb prosthetic sockets.

Their new website should include information about products, the company, customer reviews, ordering information and contacting the company.

01

DEFINING SUCCESS

This website will be siccessful if users are able to effectively and efficiently find the information they need and enjoy the design of the website such that they are encouraged to learn more about the company and its products.

POTENTIAL PITFALLS The information that needs to be presented is often jargon-heavy, as it needs to be for certain users (i.e. prosthetists and clinicians). The challenge is to structure the website such that lay-people can engage with the material while clinicians can still find the information they need. Another challenge will be to engage users who have no personal interest in proshetics or 3D printing.

02

PERSONAS

SCOTT THE AMPUTEE “I’m looking for a socket that can keep up with me at the gym.”

AGE: 32 GENDER: male MOTIVATION: - comfort, strength, usability of prosthetic - “cool factor”

03

RACHEL THE CLINICIAN “My priority is to reduce my labor hours and improve the quality of my work for my patients.”

AGE: 42 GENDER: female MOTIVATION: - patient well being - cost reduction for herself + her patients - fit + maintenance of prosthetics

DELPHIE THE SOCIAL MEDIA GURU “I found you on Instagram and want to know more about you!”

AGE: 22 GENDER: female MOTIVATION: - staying up to date on the latest trends in technology

04

RESEARCH: INTERVIEWS

A clinician, an amputee, and a lay person were interviewed to gain insight into their experience and opinons on the content and usability of an effective website for a prosthetics and orthotics company (full transcripts in appendix).

EXAMPLE QUESTIONS: 1. How do you usually hear about new technologies?

2. Where would you go to find more information about a new technology?

3. What information would you expect to find on a website for a company that makes 3d printed prosthetics?

4. How do you find information on a new prosthetic product?

5. Do you follow prosthetic companies/prosthetists/amputees on social media?

6.. Do you value testimonials and reviews when researching a new product?

7. Would you order a prosthetic online?

8. If you were looking at a website for a company that makes sockets, flexible inners, and protective covers, what product would you be most interested to learn about?

9. What information would be most important to you for each of these product lines?

05

MAIN TAKEAWAYS Most people find new technologies and companies through

social media and online news. People in the world of orthotics and prosthetics (O+P) also hear about new products from sales reps and trade shows.

The most highly requested content centered on

what distinguishes our products from others on the market. Specifically, comfort, functionality, durability, and cost were cited most often, even by lay people.

People value reviews and testimonials when learning about new products and technologies.

06

RESEARCH: ONLINE SURVEY

1. Please select your age group 2. Please select your gender 3. Are you an amputee?

4. Are you a prosthetist/clinician involved in the fabrication/ fitting of prosthetics?

5. Do you know anyone who has a prosthetic?

6. How do you usually learn about new technologies?

7. Are you familiar with 3D printing?

8. If you were looking for information about 3D printed prosthetic legs, what information would you be looking for/what would you be most curious about?

07

RESULTS The majority of respondents were neither amputees nor clinicians, but 45% knew a person with a prosthetic.

Social media was again the most popular method to learn about new technologies.

95% of respondents were familiar with 3D printing.

WHAT WOULD YOU BE MOST CURIOUS ABOUT? CUSTOMIZATION PRICING DURABILITY MATERIAL FIT COMFORT STRENGTH APPEARANCE LEAD TIME

08

COMPETETIVE LANDING PAGE

PRODUCT PAGES

09

ANALYSIS The majority of O+P company websites’ landing pages feature a navigation bar across the top with their logo to the left and navigation to the right, with a high-quality image of a person using their products taking up the majority of the landing page’s real estate. Laid over this image is usually white text of the company’s slogan or some other headline to encourage users to buy or learn more about their products.

Product pages are usually white space heavy with high quality images of the product next to a short paragraph talking about the features of the product.

10

USER G USER GOALS 1 2 3 4 5 11

Learn about the benefits of Extremiti3Ds products

Learn about the features/functions of the products

Learn how to purchase the products

Read reviews/testimonials about the products

Learn how the products are made

GOALS

12

CONTENT STRATEGY

13

WHY:

This website aims to provide information to people about the company and its products. Our users are trying to find information on our products and see if they are right for them. Our content will aim to convince them that our products are right for them.

WHAT:

The website should convey the benefits of Extremiti3D products and the mission of the company. The tone should be helpful and energetic.

WHO:

The target audience is product users including clinicians and amputees, but lay people will also view the site. They value the cost, fit, and features of the products, as well as reviews and testimonials.

WHERE:

Content will appear on a continuous web page that will be primarily viewed on computers but also will need to be viewed on tablets and mobile devices.

We anticipate that people will access the website via laptop or tablet after conducting a web search, as well as on mobile devices from the company’s social media pages.

HOW: WHEN:

Content will be presented through images and text until the company has video content to use.

The majority of content will be published upon development. As the company develops higher quality image and video content, social media content, and new products, new content will be added to the website.

14

SITEMAP

navtigation + hero our products testimonials sockets protective covers our process contact us

15

TASK ANALYSIS In early brainstorming sessions, the client determined that he preferred an

infinity style website, where all content is on one continuous web

page. This streamlined design affords very simple task analyses, user flows, and overall site mapping.

LEARN ABOUT SOCKETS

navigate to extremiti3d.com

scroll to

click on

scroll to

“our products”

“our products”

“sockets”

click on “sockets”

read about sockets

16

USER FLOWS LEARN ABOUT SOCKETS

navigate to extremiti3d.com

17

scroll to “our products”

click on “our products” in

scroll to “sockets”

section of webpage

navigation bar

section of webpage

click on

click on

read about

“sockets”

“sockets”

sockets

read about

read about

sockets

sockets

SUBMIT A “CONTACT US” FORM

navigate to extremiti3d.com

click on “contact us” in

scroll to “contact us”

navigation bar

section of webpage

insert name, email, and

insert name, email, and

phone number

phone number

type reason for

type reason for

contacting the company

contacting the company

click

click

“submit”

“submit”

18

MINIMUM VIABLE PROD DEBATE • • • •

HIGH

e commerce links to social media meet the team find a prosthetist

LOW URGENCY • pricing information

DON’T INCLUDE

19

LOW

DUCT IMPACT • • • •

INCLUDE

product information product photography contact us testimonials

HIGH URGENCY

IMPACT

REVISIT

20

SWOT ANALYSIS STRENGTHS • easy access to product and company information • establishes design language for company • portal for customer connection and contact • good design brands company as competent and worthy of engagement and sales

• • • •

engage with potential customers engage with potential investors generate sales generate interest

OPPORTUNITIES

21

WEAKNESSES • sales process could be more streamlined with e-commerce portal on website • need for more good product photography

• chance for other companies to copy your products and ideas • need for active updating to avoid customer confusion or misinformation • bad design could lead to loss of potential business and customer enagement

THREATS

22

LOGO DEVELOPMENT

Design sessions with the client resulted in a list of goals for the design of the logo: • Convey strength and mobility without appearing too athletic or sports focused • Stay consistent with existing brand language (facet based, triangles, existing color pallette) • Form should be easily associated with imagery of physical extremities or lack thereof (prosthetics and orthotics) • Balanced but not symmetrical, as Extremiti3D’s products aim to provide strength, balance, and mobility while celebrating the assymmetry of their clients’ bodies.

23

FINAL DESIGN:

24

INITIAL SKETCHES

25

26

WIREFRAMES

27

28

LOW FIDELITY PROTOT

29

TYPE

30

HIGH FIDELITY PROTOT

31

TYPE

32

HIGH FIDELITY PROTOT

33

TYPE

34

HIGH FIDELITY PROTOT

35

TYPE

36

Somer Hand AVT 519 UX Design George Mason University