Vasilis Dimos ,Co-Founder & Head UX/Design at Skroutz S.A. talks about the basic principles about "Designing Design Systems" in an engineering company such as www.skroutz.gr. Style guides, patterns and design systems are essential for any designer to achieve visual, functional and logical consistency.

1. Hello!

4. Engineering DNA
160.000 800 10 1.000.000 7.000.000
Lines of Code in Main Repo Commits per month Deploys per day Searches per day Pageviews per day

5. Vasilis Dimos

6. responsible for
Design - team
235.000
Active app installs
160.000
Active app installs
...nevermind

7. “Designing Design”
In an engineering - centric company

12. Design & Engineering
Eternal struggle?

13. Successful product = Business + Design + Engineering
Common Goal

14. Reusability
Structure
Consistency
Balance
Simplicity
Common Principles

15. Goal & Principles
What is missing ?

16. Common Language
Something both understand and can work with

17. What does a language need?
Rules & Logic

18. The rules
Style Guides Pattern Libraries

19. Style guides
A style guide (or manual of style) is a set of standards for the writing and design of
documents, either for general use or for a specific publication, organization, or field.

21. Style guides
Achieve Visual Consistency
Portable branding experience
Familiarity & Recognition

22. Pattern Libraries
Recurring solutions that solve common design problems

25. Pattern Libraries
Reuse of Components
Which are debugged
And crafted over time
Familiarity of behaviour & Interaction

26. Deliverables and goals
Make the right thing, the easy thing
to do!

27. Is this enough?

31. Design System
Design system articulates a general design direction, philosophy,
and approach to specific projects or products.

37. Through the understanding of the philosophy
Make it easy to extend the styleguide
Achieve logical consistency
Benefits of a Design System

38. Active development from a real team with Storytelling
Deliverables of a Design system
Documentation
Blogposts
Internal Presentations
Design One on Ones
Design Reviews

39. We are not alone

40. At a glance
Style guides are for visual consistency
Pattern libraries are for functional consistency
Design systems are for logical consistency

41. We are hiring!
www.skroutz.gr/blog/careers

42. Q & A
Thank you