DARC Website Redesign


Overview

Roles
UX Designer, UX Researcher, Visual Design

Date
Fall 2014

Summary
Website redesign of Dallas Athletic Ruby Club’s website.

Skills Utilized
User Research, Site Mapping, Low Fidelity Prototyping, High Fidelity Mockup


Introduction

My rugby team the Dallas Athletic Rugby Club (DARC) was in a serious need of a website redesign, so I took it upon myself to update the club’s image and bring their website into 21st century with some UX love.

Goals
I started this project by coming up with a few goals to shoot for. Hitting these goals was the benchmark for a successful redesign.

    • Easy to navigate interface

New and old users should be able to easily navigate and access what they want to with ease.

    • Works on mobile

It’s critical for all people to be able to access the website, whatever device they may be using.

    • Updated UI

In order to appear legitimate and professional our website should reflect that image. The perception of the club will be assessed in the first moments of visiting site.

    • Increase involvement with current members and affiliates

The website was full of outdated info, did not foster communication or link to ways that people could interact with the club in any meaningful way.

    • Improve community aspects

Having a better public perception will increase our recruitment of new members and inform on lookers of what DARC is all about.

Old DARC website pictured below.Darc current page


Process

Research
To begin the research phase, I envisioned all of the people who would interact with the website based on who currently accessed the website. With this list of potential users, I divided them into two primary categories.

  • Internal
    • Players
    • Alumni
    • Coaches/Admin
  • External
    • Potential new members
    • Supporters/fans
    • Other clubs
    • Sponsors

Each of these users has their own set of priorities so, with this list, I identified which sections of the website they would most likely visit or be interested in. This information would help to identify the activities they would perform and the information they would want to access.

IMAG1340

In order to validate these assumptions, the next step was to begin interviewing key stakeholders. I interviewed a current player, the head coach, and an alumni member and asked a series of questions about what they expected from the website. With this new knowledge I was able to construct a simpler streamlined site map to match these expectations.

IMAG1341

Design
Initial site designs were mocked up with a mobile first approach in mind. Players often accessed the site on the way to practice, at work or in their cars and needed to be able to find what they needed on the go.IMAG1343

IMAG1356

After some concept sketches and ideation, this format seemed fit with what I was looking for so I added some more fidelity and began identifying, what each section’s make up would be in HTML. IMAG1342

These basic sketches allowed me to create an interactive prototype of the entire site with ‘Proto.io’.

wireframe
Sketch-Mockup smaller


Previous project

Next project