HOW TO SPEAK UNICORN:
Improving Designer/Developer Collaboration
Slide 2
Slide 2 text
HI, I’M MICHELLE
@marktimemedia
Slide 3
Slide 3 text
WHO IS A
UNICORN?
Slide 4
Slide 4 text
MYTHICAL
CREATURE WITH
EQUAL TALENT
IN MULTIPLE
DISCIPLINES
Slide 5
Slide 5 text
IF I’M A
SPECIALIST…
WHY SHOULD I
GENERALIZE?
Slide 6
Slide 6 text
BE A UNICORN
SPEAK UNICORN
Slide 7
Slide 7 text
WHY SPEAK
UNICORN?
Slide 8
Slide 8 text
YOUR
TEAMMATES
ARE NOT YOUR
OPPONENTS
Slide 9
Slide 9 text
HOLISTIC PROCESS
Slide 10
Slide 10 text
BETTER
FINAL
PRODUCT
Slide 11
Slide 11 text
WHEN CAN
DESIGN THINKING
HELP DEVELOPERS?
Slide 12
Slide 12 text
SEE THE BIGGER
PICTURE…
Slide 13
Slide 13 text
…AND THE
DETAILS
Slide 14
Slide 14 text
BETTER
COMMUNICATION
Slide 15
Slide 15 text
ADAPTING ON
THE FLY
Slide 16
Slide 16 text
WRITE BETTER
CODE
Slide 17
Slide 17 text
WHAT DO DESIGNERS
THINK ABOUT?
Slide 18
Slide 18 text
#1
VOCABULARY
WORD:
WHY?
Slide 19
Slide 19 text
BIG
PICTURE
Slide 20
Slide 20 text
USER EXPERIENCE
HOW PEOPLE INTERACT AND ENGAGE
WITH THE SITE
Information Architecture, GUI, Interaction Design
KEY TAKEAWAY:
Make functionality decisions with the end user in mind,
not the application or development process.
Slide 21
Slide 21 text
BRANDING
COMMUNICATING THE ORGANIZATION’S
MESSAGE, VALUES, AND EXPERIENCE
Design System, Essence, Archetypes, Brand Strategy
KEY TAKEAWAY:
Create experiences that reinforce the company’s brand
Slide 22
Slide 22 text
COMPOSITION
HOW THE CONTENT AND AESTHETICS OF
THE SITE WORK TOGETHER
Proximity, Harmony, Unity, Balance
KEY TAKEAWAY:
Each element should feel like it belongs within the
site layout, not added as an afterthought
Slide 23
Slide 23 text
DETAILS
Slide 24
Slide 24 text
TYPOGRAPHY
AESTHETIC DECISIONS ABOUT THE
ARRANGEMENT OF TYPE
Line Spacing, Letter Spacing, Kerning, Fonts
KEY TAKEAWAY:
Typographic choices should be deliberate,
both reinforcing big-picture systems and being
aesthetically appealing and easy to read/understand
Slide 25
Slide 25 text
COLOR
AESTHETIC DECISIONS ABOUT THE USE
OF COLOR IN A COMPOSITION
Hue, Value, Shade, Tint, Saturation
KEY TAKEAWAY:
Color choices should be deliberate and
used consistantly across the entire site
Slide 26
Slide 26 text
HIERARCHY
THE RELATIVE IMPORTANCE AND
VISIBILITY OF PIECES OF INFORMATION
Emphasis, Scale, Readability, Flow
KEY TAKEAWAY:
Decisions made about the styling and position of elements
have a huge impact on the site experience