This is the presentation deck from UX Conference session by Efrim Bartosik as a part of UXSEA Summit 2019 in Singapore. UXSEA Summit 2019 was held from 18th to 20th November, 2019. For more information about UXSEA Society, visit https://uxsea.org/
The copyright of this material is with those who created this presentation material. Please take permissions from the authors if you are in doubt about copyright infringement.
9. Level 1
Producers
41% of companies
Level 2
Connectors
21% of companies
Level 3
Architects
21% of companies
Level 4
Scientists
12% of companies
Level 5
Visionaries
5% of companies
Morebenefitsfromdesign
More adoption of design
*Source: The new design frontier
10. Level 1
Producers
41% of companies
Level 2
Connectors
21% of companies
Level 3
Architects
21% of companies
Level 4
Scientists
12% of companies
Level 5
Visionaries
5% of companies
*Source: The new design frontier
Design is what happens on
screen
Wireframes
Design comps
Interactive prototypes
Design is what happens in a
workshop
Workshops
Rapid sketching
Stakeholder input
Integrations between
designer and developer tools
Design is business strategy
Trendspotting and foresight
Product market fit tests
Vision artifacts Cross-
platform strategies
Design is a standardised
scalable process
Daily standups
Planning & prioritization
Design briefs
Written documentation
Design is a hypothesis
and an experiment
Concept testing A/B
tests Analytics
30
12 54
13 15
11. Level 1
Producers
41% of companies
Level 2
Connectors
21% of companies
Level 3
Architects
21% of companies
Level 4
Scientists
12% of companies
Level 5
Visionaries
5% of companies
Morebenefitsfromdesign
More adoption of design
Design Systems
*Source: The new design frontier
21. Naming conventions inspiration? – What CSS framework are we going to use? –
What Grid system are we going to use? – How will we create our typography
utility classes? Abstracts or concrete? – Who will be implementing this? –
Where do we develop the Vue components? Single page with everything? – Aim
to keep component nodes and DOM depth to a minimum – Do we need any
environment setup or would push the library to gemfury for HK CC usage
enough? – Who will be implementing this? – A/B testing in the future? – Will the
spacing tokens be responsive? – Colour names? Do we want utility classes, or
just abstracts? – How will we create out spacer classes? Do we want concrete
utilities, or can use abstracts in CSS? – How to handle icons? – How do we
approach this in a modular way? – How do we document these classes and
functions? – The size implications of these decisions? – Naming conventions
inspiration? – Normalize.css + Skeleton (minimal) + Tailwind (utility
placeholder inspiration) – Do we use Pug? – Run time compilation??
Sometimes?? – Specify each prop or send over as big objects? – How do we decide
on Vue libraries to use? (bloat vs just build it ourselves) – Directory Structure of
33. *Source: Need for speed research Google
The speed it takes to load a page
How easy is it to find what I’m looking for
How well the site fits my screen
How simple the site is to use
How attractive the looks
75%
66%
61%
58%
24%
34. x amount of legacy systems
x amount of releases
over x amount of ⏱
x amount of people
Old Systems
x amount of ⏱ and 💵
Vs
New design system ❤
x amount of ⏱ and 💵
x amount of releases
over x amount of ⏱
x amount of people
=
=
38. 1570 Palladio provided rules and vocabulary for
designing and constructing buildings, including
principles and patterns, with detailed illustrations
and explanations of how they work
The past