How UXPin unifies design with code in design systems Recent design system features in UXPin alongside roadmap Predictions for the future of design tools.

1. State of the Union
Photo by Iker Urteaga on Unsplash

2. Digital product
design is growing up.

3. The expectations are higher.

4. We’re in the teenage years of
digital product design.
Photo by Drew Hays on Unsplash

5. Energy and growth are great!

6. but…

7. Our relationships are
sometimes awkward.
Photo by Jenna Jacobs on Unsplash

9. And everything is
distracting.

10. New Design Tool!
New Design Tool!
New Design Tool!
New Design Tool!
New Design Tool!
New Design Tool!
New Design Tool!
New Design Tool!

11. We have to grow up.

13. And we need help.

14. Design Systems!

15. Inevitable Hero
Photo by Nathan Anderson on Unsplash

16. Guidance, Order &
Mature Relationships

17. Photo by José González on Unsplash
Agreement

19. Adele is Open Source
https://github.com/marcintreder/adele

20. Let’s talk about the data!

21. 95%Of 59 analyzed systems have
coded components

22. 39%Of 59 analyzed systems have a
UI Kit created for design tools.

23. Mind-boggling disproportion
Photo by Hannah Gibbs on Unsplash

24. 77%Of 56 analyzed systems with
coded components are JS based.

25. 70%Of 37 analyzed systems with
coded components in JS are
created with React.js.

26. Unquestionable dominance
Photo by Matt Helbig on Unsplash

27. 92%Systems have
a color palette
89%Systems have a
typographic scale
94%Systems have a
collection of icons

28. 29%Of 59 analyzed systems have
accessibility guidelines ☹

29. What does it mean for UXPin?

30. Since 2010, UXPin is on the mission to
merge design and development into one
new world of better and faster product
development.

31. UXPin today is the state of the
art design platform combining
easy and fast prototyping,
powerful collaboration and
design system tools.

32. The Summer of 2016

33. Innovation & Optimization
OPTIMIZATION
INNOVATION INNOVATION
Cycles of product development at UXPin

34. Innovation Optimization
• CustDev Research
• Long cycles
• MVP and/or alpha tests
• Process: more freedom
less structure
• Usability testing
• Short cycles
• Multiple releases a
week
• Process: structured and
predictable agile

35. The first version of UXPin
Design Systems solution is in
the intense optimization phase.
Let’s take a look at what’s new!

36. What’s next?

38. In 2018 UXPin is going to
render production code as
design components inside of
a design tool. This radical
solution is going to enable
new, better, product
development process.

39. UXPin
CI server
GitHub
Components Render
Design System Render

40. https://www.uxpin.com/design-from-code

42. What else?

43. Aggressive API strategy

44. What if…?

48. Were all available as JSON?

49. Innovation/Optimization
cycle is endless!
Photo by Matt Helbig on Unsplash

50. Together we’re going to bring
design to the next stage.
Photo by Matt Helbig on Unsplash

51. Thank you!
@marcintreder