Web Teaching Day - Agency ready and other things

Post on 27-Jan-2015

105 views 0 download

Tags:

description

Presentation from Web Teaching Day 2014 - Sharing some of the new and upcoming changes to teaching front-end web development at Manchester Metropolitan University. Part of the #webteachingday hosted at MMU. A 'self-help' group for those teaching aspects of web design/development.

Transcript of Web Teaching Day - Agency ready and other things

Checklist

• Health & safety• Wifi• Programme• #webteachingday• Welcome

Agency Ready & other things

About

• Teaching standards based, accessible, usable web design since 1996 in partnership with Jonathan Willson

• Originally in Library School• Now, technology in Humanities• BSc Web Development (plus other routes inc. new MMJ)• 2016 hoping Digital Marketing & Web Development

Things done/doing

• Level 4– HTML5 – semantic elements?– Free Treehouse– Single column layout

• Level 5– Agile sprints for group work– Responsive / frameworks– Single/multiple column template

• Level 6– UXD Unit– Agency Ready for 2014/15?

Level 4 - HTML5 – semantic elements?

Q. Do we introduce HTML5 semantic elements in the 12 weeks basics?A. At the moment, no.

Level 4 - Single column layout

Q. What on earth is the correct CSS for a basic, single column layout?A. What?

Font size? Classes / IDs? Responsive images? Responsive containers? Max width? Rems?

Level 4 - Free Treehouse

• Free access for L4• Lynda.com - MMU site licence starting soon

Level 5 - Agile sprints for group work

• Client brief to site launch• Working in groups• Weekly sprint meetings with tutors– What did you achieve last week?– What do you intend to achieve this week?– While you are with us, AOB?

Level 5 – Responsive / frameworks

• Guest speaker – Liam Richardson of Sigma• Foundation Framework exercise• 5000 plus lines of code• Ban frameworks at Level 5?• Ban CSS resets?

Level 5 – Single/multiple column template

• Responsive framework from ground up• http://www.adamkaplan.me/grid/• Plus normalize• Plus mobile first• Plus L4 single column goodies

Level 6 – Agency Ready

• Chance for the student 'to get agency ready'• Build a professional portfolio• Ever changing content – SASS, Versioning, Responsive, HTML

emails, Frameworks, SEO, Advanced HTML5 etc.• Industry advice, clients, billing, working in an agency• Finale - Portfolio show with employers

Level 6 - UXD

• Shared by three degree routes– BSc (Hons) Web Development– BSc (Hons) Digital Media and Communications– BA (Hons) Digital Media / Marketing

• Not all students want to be UX pro’s

UXD in the curriculum

• UX taught as part of web design from year 1• Concepts and practice of web accessibility and usability

introduced in year 1• User journeys, user tasks, card sorting, personas, prototyping,

scripted usability testing session all introduced in year 2

Approach to UXD

• A new approach to teaching UX• Very much 'hands on'• Very much based on current industry practices• What do you guys actually do?– We asked people (including @lizziedyson)– We gathered a list of key tasks– We gathered a list of common methods and practices

The programme – 12 weeks

• Expert review, heuristics, ethnographic techniques • Successful surveys • Planning and conducting usability testing • Usability Lab testing • Guerrilla Testing• Eye Tracking in usability testing• Remote testing• Using Analytics for UXD • Pitching and presenting your findings

Our guests

• Planning and conducting usability testing – Chris Collingridge @ccollingridge, Sage

• Guerrilla Testing - Chris Bush @suthen, Sigma (last minute – Barry Briggs @quiffboy, Amaze)

• Eye Tracking in usability testing - Guy Redwood @eyetracking, SimpleUsability

• Remote testing – Userzoom - Lee Cooper @UserZoom and WhatUsersdo – Lee Duddell @whatusersdo

• Using Analytics for UXD - Paul Carysforth @paulcarysforth, Amaze• Pitching and presenting your findings - Jane Murison @mewroh, BBC

Task 1 – Expert Review

• Group selects a web site• Site approved by tutors• Individuals undertake– Cognitive walkthrough– Heuristic evaluation

• Report back to group, share findings and confirm that choice of web site is suitable– Two groups changed to a different site

Task 2 – Guerrilla Testing

• Working as a group• Define issues to focus on• Prepare tasks, user types, consent form• Select tech (laptop, tablet, phone)• Screen capture, film, notes• Undertake sessions 'in the field'• Review findings

Task 3 – Final Testing Method

Choice of:• Eye tracking [Tobii eye tracker]• Lab based user testing [Morae recorder]• User survey [UserZoom]• Analytics [access required]• Remote User Testing [UserZoom, WhatUsersDo]

Matt's movie

• Example of student submission• http://youtu.be/AtUD9wMB0rk