top of page

Purpose

Individual freelance project to design a mobile-friendly website for an Austin private practicing psychiatrist.

Objective

 My objectives were  research, ideate,  design and implement a website for a psychiatrist. The site is to be accessible, usable, credible and mobile-friendly.

Challenge

The doctor requested a small business website to increase her digital presence in Austin. Her requirements were for the design, structure and content to be accessible, include SEO, and be visually professional, yet also depict her and her practice as approachable and whole-person focused.

Approach 

My approach was to work closely with the client, while keeping her updated about the design. This communication made it more easy for her to  understood all of the "whys" of my choices and allowed for better understanding and buy-in of the final product.

 

I chose this project in my portfolio because mental health providers are now encouraged to have a digital presence but many do not know how to create a user-friendly, accessible website. This site may be the first conversation Dr. Leon has with her a future patient.

Project duration

Two weeks - Summer 2017

My Team

Individual

My Roles

Research, IA, Content, Visual, Accessibility, SEO, Client Relationship

Website Link

www.stacyleonmd.com

Research
Getting to know our users

Business Analysis

  • Client meeting to understand mission, philosophy and practice goals

  • Interviewed people about why patients choose the client

Competitive Analysis

  • Increasing rates of anxiety in adolescents and children

  • Most psychiatrists websites are too wordy and hard to skim

Contextual Inquiry

  • Patient or patients families are usually in a crisis when they decide to visit a psychiatrist, and not always at a desktop computer

  • Important to see where all training was conducted

  • Would like to see resources as education

  • Easy to find contact page

Insight

From my research, I decided to have a mobile-friendly website for those parents who were in their car searching for help. Visuals and content needed to portray trust, credibility, and sophistication.

Information Architecture and Content
How is the information organized?

How and Why?

User flow

Where, why and how was the user(s) going to use the website

The main user is under stress and needing immediate help.

 

Proto-Personas

My proto-persona is Alison. She is the parent of an adolescent who is struggling. The parent is stressed, the adolescent is cratering and non-communicative. The parent just dropped him or her at school, and the parent is in the car googling for help.

Site Map

Simple navigation site map with less than five links and limited scrolling.

Content

Main goals are accessibility, usability, credibility and findability

  • No email on the site because she feels it's important for people to take an actionable first step, which is picking up the phone

  • Personable photos that show people and Austin places for relatability

  • Board logos for credibility

  • Personal branding statement, color and iconic illustration

  • Word choices in About me and other pages are descriptive yet concise. Trust is main goal for client.

  • Google map and photo of the office building so patient had visual cue of location

Wireframing
Laying out the initial design components

Initial sketching of wireframes

How and Why?

  • After client meeting, hand sketching wire-frames put my thoughts into a tangible object

  • Wire-framing allowed me to focus on website features and focus on usability and navigation
  • Confirmed interactions and pages the we wanted user to navigate
  • Wire-frames help me make the design process iterative

 

Insights

  • A challenge was where on navigation bar would the "policies" page be located; from wire- framing iterations, the decision was policies to be placed as a sub-category to "services"

  • Decision to simplify pages for the user/patient patent, and to design five max navigation buttons

  • Design a CTA button for automatic phone call  on every page

  • Content to include credibility and board certification on footer

  • Content to include google map and office building map for orientation of user, particulary if trying to locate while driving

Visual Design
Look and Feel of the Website

Wireframing site design in Sketch.

A homepage iteration with initial color palette

Mobile-friendly iteration with change of colors

How and Why?

  • Believed a visual focal point on each page would help with client's identity and marketing
  • Collaborated with a logo artist and client to create an iconic illustration
  • Focused on visualizing mission statement of "reaching your potential"
  • Text is in dark blue for clarity for low vision readers and subtlety. Black was stark.

 

Insights

  • Changed colors from greens and blues to shades of purples. Purple represents sophistication, wisdom and independence

  • Photo content is people socializing, outside or in groups, to show a prospective patient that through therapy, they can become mentally healthy

  • Word choices are clear and concise, and state her credibility on all pages

Usability and Retrospective

How and Why?

  • User testing was key to understand how people viewed site
  • Chose wix.com as site host; client could easily check on status of progress and do future edits
  • Getting found on Google - created keywords and taglines for all pages for SEO

 

Insights

  • Changed content on navigation bar - changed to  "Treatment" instead of "Services" for clarity

  • Importance for client website to be found on Google - carefully chose key words after researching what people type in for a psychiatrist search

  • Confirmed all links to resources are live and working

Retrospective

  • Positive process working one-on-one with a client

  • Meaningful knowing that more people will have access to mental health care because of her website

  • Will continue edits, as needed in the future

bottom of page