Designer vs Developer - A Battle Royal v1.0
36
-
Upload
nicole-maynard -
Category
Technology
-
view
792 -
download
0
description
SharePoint Fest Chicago 2013 - Can designers and developers work together to create a frictionless solution? Often times barriers exist between designers and developers. Let's look at what UX really is, not hearsay and learn some interesting ways devs can help. And bring peace to this historical battle field, by showing the two factions can work together amicably when supported by a well-defined process. Content covered will center around web, desktop, mobile, and yes a little bit of SharePoint. Discussion topics will include a brief history of user experience (UX) design, a "concept to deliverable" process involving designers and developers, and finally a short demo highlighting covered concepts.
Transcript of Designer vs Developer - A Battle Royal v1.0
DESIGNER DEVELOPER
Bryan “Rock Star” Gulley @uxjester Interaction Design
UI Development
Information Architecture SharePoint UI Sleuth
Nicole “Nicky” Maynard @punkynixter User Research
Information Architecture
Interactive Design Visual Design
DESIGNERS DEVELOPERS
ROUND 1 Designer
“Design is not just what it
looks like and feels like.
Design is how it works.”
Steve Jobs
Yes, it’s beautiful.
Started when humans made
tools to make tasks easier
After WWII ·Engineers research, lessons learned
·Human Factors & Ergonomics Society
Paul Fitts ·Improved cockpits
·Fitts’s law still used today
Dieter Rams · Braun industrial designer
· “Less, but better”
Walt Disney · First immersive experience by UCD · “Imagineers” first UX team?
Donald Norman
Researchers Information Architects
Design Strategists
Content Strategists
Visual Designers
Interactive Designers
us·er noun A person who uses or operates something, esp. a computer or other machine. Synonyms Consumer, customer, employee, client, patient
Antonyms Stakeholder, steering committee member, designer, developer
Defined by Google.
What is UX
a person's perceptions and responses
that result from the use or anticipated
use of a product, system or service ISO1924
Includes The Users’
emotions, beliefs, preferences, perceptions,
physical and psychological responses,
behaviors and accomplishments
that occur before, during and after use
Influential Factors
System User Context of Use
What Who Why When Where
Everything That Affects A User’s Interaction
Meet the users’ needs & reach business goals
Solve business problems!Improve communication!Drive adoption & productivity!Ensure profitability!Enjoyable to use!
Meet the users’ needs & reach business goals
Make people happy by creating great experiences
User Experience Drives Behavior & Action
How a user feels about a system
Impacting time, cost, profit and satisfaction Impacting time, cost,
profit and satisfaction
Affects their
behavior & choices
How a user feels
about a system
Negative Impact Undesired Behavior Bad Experience
User Experience Drives Behavior & Action
How a user feels about a system
Impacting time, cost, profit and satisfaction Impacting time, cost,
profit and satisfaction
Affects their
behavior & choices
How a user feels
about a system
Positive Impact Desired Behavior Good Experience
01 RESEARCH 02 ANALYZE 03 IDEATE 04 STYLIZE 05 BUILD
EVALUATE
User Centered Design Process
ROUND 2 Developer
A Developer’s Approach to UX
23
! White boarding
! Wireframing
! Prototyping
! Implementation
White Boarding
24
! Think “Sketch”
! Information Architecture
! User Centered Design
Wireframes & Prototypes
25
! Think “Skeleton”
! Sketch to Screen
! Annotated User Interface
! Shareable
! Testable
26
DEMO
Disclaimer
27
! Previous 4 slides are an example of how not to conduct development tasks with users
! More on that later
Implementation
28
! Skeleton to SharePoint
! Putting it all together
! Migrating the “design” with Design Manager
! We are not limited to the Design Manager
! Use of SharePoint Designer Strongly Discouraged
29
DEMO
Tips, Tricks & Tools ! Tips ! Don’t use SharePoint Designer for master pages, page layouts, HTML, CSS, JS, etc. ! Use tools that work well in your workflow
! Tricks ! Network Drives ! Build reusable frameworks, libraries, plug-ins, “Starter” assets ! Utilize proven work by others
! Tools ! Raw HTML, CSS, and JavaScript ! Libraries like Twitter Bootstrap, YUI, jKit, Wirefy ! Sublime Text, Notepad ++, Coda, Plain Ol’ NotePad ! Axure, OmniGraffle, Fireworks, etc.
Designer Developer
TIE MATCH
01 RESEARCH 02 ANALYZE 03 IDEATE 04 STYLIZE 05 BUILD
EVALUATE
User Centered Design Process
How we work together · Communication - keep everyone involved in the whole process
· Check your ego at the door
· Set expectations and boundaries, build trust
· Know each other’s lingo
· Understand each other’s process, job and value
· Be excited to teach one another – not chastise for gaps in knowledge
· Devs aren’t machines, they have feelings too
· Designers aren’t machines, great work takes time
Key Take Aways · NNg’s Intranet Design Annuals
· UX is valuable investment · $10 change in UX phase, $100 in Design, $1,000 in Development
· UX bridges the gap between business and IT by being
the spokesperson for the user
· Design and Development are equally important
· Keep communication open throughout the entire process
· Learn each others’ job, limitations, lingo
· Collaboration is more important than your ego, you are working
toward he same goal
35
Robert Toro Portals & Collaboration Practice Director
[email protected] 630.309.4042
Nicole Maynard UX Designer
[email protected] 630.251.8821
Bryan Gulley UI Developer
[email protected] 773.359.3384
SLALOM CONTACTS
© 2013 Slalom, LLC. All rights reserved. The information herein is for informational purposes only and represents the current view of Slalom, LLC. as of the date of this presentation. SLALOM MAKES NO WARRANTIES, EXPRESS, IMPLIED, OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.
![Thompson, Peter - [NF] the Battle for Singapore [v1.0]](https://static.fdocuments.us/doc/165x107/5571fb61497959916994b7e4/thompson-peter-nf-the-battle-for-singapore-v10.jpg)
