• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Copenhagen ITU 2010 UXBASIS and concept development
 

Copenhagen ITU 2010 UXBASIS and concept development

on

  • 1,559 views

In December 2010 Copenhagen's IT University requested a talk about UXBASIS and how the process could fit within concept development of digital products. This presentation formed the basis of the talk. ...

In December 2010 Copenhagen's IT University requested a talk about UXBASIS and how the process could fit within concept development of digital products. This presentation formed the basis of the talk. Some slides have been removed to maintain client confidentiality.

Statistics

Views

Total Views
1,559
Views on SlideShare
1,558
Embed Views
1

Actions

Likes
3
Downloads
50
Comments
0

1 Embed 1

https://www.linkedin.com 1

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • In London I worked for Reed Elsevier. In that time I had the role of a design manager running projects and art directing. Leading a team of 8 front end developers and designers. Whilst working there I completed an MA in Design Practice and once qualified I moved into another job within the company as their first Information Architect of the business division Here I planned the structures and interactions for 8 industry websites and formulated an Information Architecture strategy
  • The standard waterfall model
  • To the iterative model, encapsulated by Agile and SCRUMContrary towhat I wilbetalkingabout I am processagnostic, but do believe in the value of placing the user at the heart of design decisions alongside business needs and the contentyouintend to provide
  • The need for collaborationbetween professionals is fundamental to delivering the bestproductsThis diagram looks at some of the disciplines involved when building an online productTo orchestrate this requires careful project management, but it is very easy to be focused on delivery to time and budget whilst forgetting the purpose of the product and fulfilling the needs of the usersOf course a main success criteria is to gauge the culture you must operate in and be in tune with your team member’s needs
  • This is a project timeline for the computerweekly.com website that shows how different areas of site development had to be synchronised as development took placeThe four streams are development (back end code), user interface (visual design and front-end code) information architecture and user experienceThis diagram is to highlight different areas and so each area has been brought out on top of the ux stream but in reality the UI, IA and Dev streams are all a part of UX
  • …but they shouldn’t prescribe the solutionOften PMs are worried about how you can use user tests without harming deadlines, or interrupting development schedules.Done right though, it need not be an obstructive part of the development of a product –just a necessary aspect of it. It really is a question of timing and validating the work quickly, and changing the product immediately upon that feedback. Being responsive and having the capacity to execute quickly is what Agile is really about…
  • I really want to highlight this point.How things look (visual design) how they work (the interaction and development of functionality) and how the product answers the needs and wants of a user (aligned to the business purpose) all are a part of the user experience.Often UX is seen as usability - but that is only a part of the storyWhen building products we should pay attention to the whole of the development of a product ensuring the users are at the heart of decisions made.
  • Complex projects can easily become unwieldy and lack focus due to production factors and resource issues.This inevitably harms the quality of the product and does not promote a user focused solution.UXBASIS is a way of practically applying techniques from a business perspective, while keeping true to the goals of the users.UXBASIS is a process based on our experience of building digital solutions.
  • UX BASIS is a process and a set of tools to help an organization engage with users through the products that are developed.UXBASIS helps communicate projects with other UX professionals, stakeholders, designers and developers.
  • An aspect in being involved in this type of work is the ability to convince stakeholders that a certain approach is relevant to their businessBut we are spread thinly and always busy, so we built a physical version of the model so our account people could take the box and discuss the tools with clients.This way of looking at the cards and seeing the various tools available, helps formulate a plan before we are involved in the next phase.(Here I will show the box and get the board out will take 5 minutes)
  • The poster in enormous and fills a wallAll the cards are also shown alongside the modelBy having this in the development environment it keeps another aspect of the project (the user) to the front of mind and enables conversations around issues to be started
  • UXBASIS has5 sectionsEach section holds several methodsEach section covers a particular user experience needThe different sections are:Business IntelligenceAnalysisStructure InteractionSample
  • The Business Intelligence section involves:Identifying the clients needsClarifying and finalizing the briefNoting the overall business goals
  • Interviews with key decision makersInterviews are one-on-oneFocus is on the overall deliverable and success criteriaIdea is to: Gain insight of the clients business cultureForming a thorough briefUltimately dictates the end buildCombine with a Concept Model to give added value to information gathered.
  • Measurement of success and failures in the marketplace. Helps in informing a particular solution. Establishes best practices in competing websites and to learn from different approaches and innovations Matrix diagram can help describe pros and cons of competitors
  • The Analysis section involves:Identifying the user needsClarifying theend usersFocusing on content and structure
  • In-depth descriptions of fictional characters based on user groups identified in user interviewsCovers theusers behavior, attitude, skill and goal with the productCan later be used when testing to ensure the right users are recruited for testingWe’ve also found that the developers we use like having them around as they help them keep the end users at mind
  • Designed to give an overview over the different possible elements of a productCan be used as a roadmap to identify which elements should get primary focus and which are secondaryOutlines the needs/wants of the users in conjunction with the business goalsCan be understood by everyoneIs key at the end of the Analysis stage, but can feature multiple timesThe concept model is a necessary deliverable to all our projects as it outlines the needs and wants of the user base, alongside the business goals of what the application should satisfy.Aim: to give the developer group an easy point of reference as the project progresses to maintain focus on key strategic areas.
  • Meeting with stakeholdersFormulate ideas, the concept, direction and contentCan identify business goals not previously mentionedAllows design team to explore new suggestionsMore innovative solutions are created when stakeholders are allowed to contributeDuring the workshop some elements of the product can be sketchedSketches made will be the foundation for the wireframes and interface design workA concept Model should be developed as a result of thisIf a Concept Model already exist, it should be amended.The workshop ensures that before any interaction design work is started that all are in agreement as to what will be delivered.Working with Novo Nordisk on their intranet we had a Collaborative Workshop
  • Information gathered is used to develop the framework
  • Having first defined the user roles we can now plot a path through the product for each user goal.Particularly useful with complex structures and multiple user types e.g. social networking or ecommerce.Aim: Shows user’s tasks, their modes of behavior and any potential challenges that a user may discover when using the product.
  • CreatingDevelop the layout and overall structureBuild product content templates
  • Key screens are wireframedIfsketching was done during the Collaborative Workshop these will be used hereFocus is on: How the user navigates How they complete tasksInterface designers and information architects together create the wireframesCan be used for testing to ensure they meet users needs
  • Fully functional HTML prototype with complete structure Focus is on the interaction design of the product Aim is working prototype the development team can use Final testing can be done to ensure that the interaction matches the user requirements
  • Users are tested using hardware that tracks where they look Focus is on the users apparent interest in product elements Aim is useful information that helps optimizing the layout Eye tracking on visual designs only
  • Information design and UX Trigger words – Cappuccino
  • User testing
  • UXBASIS in the Pitch – concept work
  • Social media is IA
  • Communicating an experience
  • UXBASIS is not meant to be used in its totality for each projectEach project requires their own approach The need for UXBASIS methods depends on the problem they will solve and the solution required
  • Will wrap up with questions…..and pass the box around for people to see
  • Will wrap up with questions…..and pass the box around for people to see
  • Will wrap up with questions…..and pass the box around for people to see

Copenhagen ITU 2010 UXBASIS and concept development Copenhagen ITU 2010 UXBASIS and concept development Presentation Transcript

  • An introduction to
  • Agenda
    • My background, work and experience
    • Process, collaboration and planning
    • UX and Usability
    • UXBASIS
    • Business Intelligence (15 min break)
    • Analysis
    • Structure
    • Interaction
    • Sample
    • Cases
    • Where do you go from here?
  • My professional background
    • Senior web designer
    • Design manager
    • Information Architect
  • At Reed Elsevier I experienced a company that went from…
  • …to this
  • Collaboration
    http://www.flickr.com/photos/userpathways/2629352032/
  • We know this isn’t easy….
    http://www.flickr.com/photos/userpathways/3874772978/
  • Hello Group
  • Usability tests canvalidateourassumptions
    flickr: julianbleeker
  • Userexperience is morethanusability
    flickr: julianbleeker
  • How did we get here?
    Introducing UXBASIS
  • What is it?
    UXBASIS
    UX BASIS is a process and a set of tools to help an organization engage with users through the products that are developed.
    UXBASIS helps communicate projects with other UX professionals, stakeholders, designers and developers.
  • UXBASIS – UX in a box
  • Poster for (Agile) development rooms
  • UXBASIS
  • Business Intelligence
    UXBASIS
    Business focused information gathering
  • Stakeholder Interviews
    UXBASIS
    • Gain insight to the business culture
    • Focus on deliverables, the success criteria
    • Forms a thorough final brief
    • Contributes to a Concept Model to align expectations
  • Competitor Analysis
    UXBASIS
    • Measurement of success and failures in the marketplace.
    • Helps in informing a particular solution.
    • Establishes best practices in competing websites and to learn from different approaches and innovations
    • Matrix diagram can help describe pros and cons of competitors
  • Analysis
    UXBASIS
    User focused information gathering
  • Personas
    UXBASIS
    • In-depth descriptions of fictional characters
    • Focus is on identifying common traits with users
    • Aim is to cover user behavior, attitude, skills and goals
    • Can later be used during testing to ensure appropriate recruitment
  • Persona example
  • Concept Model
    UXBASIS
    • Provides an overview of possible product elements
    • Focus is the user wants/needs and the business goals
    • Aim is to create an overview map everyone can understand
    • Ideally created early and then edited throughout the process
  • Concept model example
  • Concept model example
  • Collaborative Workshops
    UXBASIS
    • Meeting with stakeholders to explore ideas
    • Focus is on concept, direction and content of product
    • Aim is to come up with more innovative solutions
    • Can identify business goals not previously mentioned
  • Structure
    UXBASIS
    Developing the information framework
  • User Journeys
    UXBASIS
    • User path to the goal in the product is defined
    • Focus is on user’s tasks, behavior and challenges
    • Aim is a tool from which the information structure can be generated
    • Useful with complex structures and multiple users
  • User Journeys
    UXBASIS
  • User Journeys
    UXBASIS
  • Interaction
    UXBASIS
    Creating the flow
  • Wireframe
    UXBASIS
    • Key pages are produced possibly based on earlier sketches
    • Focus is on navigation and task completion
    • Aim is a tool that can be used to start the interface design
    • Can be used in conjunction with a Think Aloud test
  • Wireframe
    UXBASIS
  • Wireframe
    UXBASIS
  • Prototype
    UXBASIS
    • Fully functional HTML prototype with complete structure
    • Focus is on the interaction design of the product
    • Aim is working prototype the development team can use
    • Final testing can be done to ensure that the interaction matches the user requirements
  • Wireframe example
  • Sample
    UXBASIS
    Testing the results
  • Eye Tracking
    UXBASIS
    • Users are tested using hardware that tracks where they look
    • Focus is on the users apparent interest in product elements
    • Aim is useful information that helps optimizing the layout
    • Eye tracking on visual designs only
  • User Journeys
    UXBASIS
  • Cases
    flickr: julianbleeker
  • Refugees United
  • Airshoppen seating application
  • Fritz Hansen
  • Fritz Hansen
  • Roskilde Blog
  • Tradeshift
  • Tailor the UX process to your project needs
  • How do you get there?
    UXBASIS tools help define a new project regardless of it’s constraints.
    This map helps scope a project dependant on specific questions held in a brief.
    Each ‘destination’ being a tool described in UXBASIS.
    http://www.flickr.com/photos/uxmosis/5142954146/
  • Thank you
    Find out more on uxbasis.com
  • Thank you
    Or follow us
    on Twitter:
    @uxbasis
    @hellogroup
  • Thank you
    Or Facebook: http://www.facebook.com/UXBASIS