ansignature

Youthworks Outdoors - Experience Design

One of the leading providers of outdoor education, holiday camps and venues for hire in NSW.

Challenge

This challenge in Youthworks website was visual design and content presentation. The events and campaigns they have should be appealing in design and right way to go and book for it.

Objective

Coming Soon.

Approach

User Research & Analytics, Experience Design, Wireframe, Visual Design and Frontend coding

The process started with user interviews, stakeholders idea and ideation they want to do with their digital experience. The next was us to present wireframe concept to acquire their business requirements. The final solution was to produce visual components for the final solution.

Design Details
  • Date: November 2013
  • Platform: Desktop, tablets, and mobile (Responsive)
  • Technology: Adobe Creative Cloud, Jira, C#
  • Targeted Users: Age of 14-25, 60% Male, 40% Female, 60% College and University Students, 30% School students, 20% Random visitors
Design Process
  • Understand
  • Sketch
  • Decide
  • Prototype
  • Validate
What did I do?
  • Documenting design and visual design requirements
  • Map information architecture and content strategy
  • Visual design for the approved prototype and interaction guidelines.
  • Creating wireframes and low-fidelity prototypes
  • Visual design & guidelines
  • Front-end development HTML, CSS
EMPATHIZE

The project was targeted to sporty youths and college students who love adventure sports, fun and campaigns. The user research was done among few of the students from Youthworks and interviews to stakeholder with a comparison to their older website.

PERSONA & USER JOURNEY

There are few personas created after user research. Personas for the youth, who loves sports and adventure campaigns, his behaviors and characters were defined and create simple user journey to book the campaigns.

SITE MAP & NAVIGATION

The sitemap has to be very defining manner with all the pages mentioned and created the proper navigation model with the help of sitemap.

WIREFRAME & PROTOTYPE

The first iteration for sketches was ready to propose for stakeholders with column design for the different types of content in separate columns. Each content page was wireframe and proposed in meeting with stakeholders.

VISUAL & INTERACTION DESIGN

The high-fidelity visual designs were created for each and every page. The page the layouts were designed for all kinds of devices, mobile, tablets, and web. The fonts, colors, layouts, icons, labels, and spacing were defined properly to create the final visual design. This process took few more iteration to sign off by stakeholders.

USABILITY TESTING

After proper testing with users in stakeholder’s side, the google analytics and user analysis were done to review the new website and its features. The content presentation, user journey was completely different and created excitement to book the events.

Visual Designs