the process of building a website

36

Upload: frank-west

Post on 27-Jan-2015

104 views

Category:

Design


2 download

DESCRIPTION

In this interactive session Frank will be talking through the process of building a website from conception through to deployment. We will be looking at how UX can be used during each phase of the build and how we can create better relationships with everyone involved in the process. Learn to use UX in new ways, work closer with project teams and identify new ways of selling UX to your client and your boss. You'll be playing the role of UX professionals, users and the client as I take you on a journey to a more enjoyable experience.

TRANSCRIPT

Page 1: The process of building a website

@frankjwest

Let's build a website together, live!

The process of building a website

WF

Page 2: The process of building a website

@britehire

Frank West

CEO and Founder

Page 3: The process of building a website

the less we do when we're ready to do it!

The more we do before we do anything

It’s all in the planning

Page 4: The process of building a website

Photographer

Project Manager

SEO

Server Administrator

Strategist

Testers

UsersUsers

UX Consultant

Videographer

Account Manager

Backend Developer

Boss

Business Analyst

Client

Copywriter

Database AdministratorDatabase Administrator

Designer

Frontend Developer

Marketing

Meet the team!

What do we need to build a website?

Page 5: The process of building a website

Application

Blogs

Brochure

eCommerce

News

Social network

The brief

Page 6: The process of building a website

Accessibility

Brand awareness

Newsletter sign ups

Money

Reduce call centre volume

Return visits

SEOSEO

Traffic

The goals

Page 7: The process of building a website

Target audience

Page 8: The process of building a website

@frankjwest

Exercise 1

Features

WF

Page 9: The process of building a website

The whole team – 30 minutes

Not about detail

Not about looking good

Scamping

Page 10: The process of building a website

@frankjwest

Exercise 2

Draw the website

WF

Page 11: The process of building a website

To mix experience with imagination and toavoid corruption

Why did we do this?

Page 12: The process of building a website

Direct competitors (Local/Global)

Similar concept, different market

Similar style but different concept

Wouldn't it be nice to change the world

Competitor research

Page 13: The process of building a website

...Do you love your partner?

Do you love your job?

Changing the world

Page 14: The process of building a website

@frankjwest

Exercise 3

Key features

WF

Page 15: The process of building a website

We've seen the competitors

We've got an idea of functionality

We've seen other peoples ideas

Let's do it again

Scamping 2.0

Page 16: The process of building a website

@frankjwest

Exercise 4

Draw the website again

WF

Page 17: The process of building a website

Recreate the best ideas for the client.

Take them on the journey.

Don't just show them what you did.

Bring them on board!

Client time

Page 18: The process of building a website

How long

How important

Grading 1 – 5

Understanding the scope

Page 19: The process of building a website

@frankjwest

Exercise 5

Rate that feature

WF

Page 20: The process of building a website

Sitemap

Page 21: The process of building a website

Agile

Page 22: The process of building a website

Copy

Page 23: The process of building a website

Use annotations for requirements

Interactive wireframes

Page 24: The process of building a website

@frankjwest

Exercise 6

Wireframes

WF

Page 25: The process of building a website

Explain the purpose of the site

Set the user tasks

User testing

Page 26: The process of building a website

Bring them on board

Client time

Page 27: The process of building a website

Design

Page 28: The process of building a website

Client time

Page 29: The process of building a website

Do not explain the purpose of the site

What do they think the website is for?

What stands out?

User testing

Page 30: The process of building a website
Page 31: The process of building a website
Page 32: The process of building a website

Flat builds

Testing

Development

More testing

User testing

Sprint

Page 33: The process of building a website

Ready to launch?

Page 34: The process of building a website

What went well?

What went badly?

How can we make the next sprint more effective?

Review the sprint

Page 35: The process of building a website

Flat builds

Testing

Development

More testing

User testing

Sprint

Page 36: The process of building a website

@frankjwest@britehire

Thank you

WF