Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Digital Workplace design is more than a picture

90 views

Published on

Download presentation to watch embedded GIFs!
Practical guide to creating great UI for digital workplace solutions: best practices, design fuck ups, usability research tools and more!

Published in: Business
  • Be the first to comment

  • Be the first to like this

Digital Workplace design is more than a picture

  1. 1. Anna Kravets CEO, ANROM Social Business 525 px 40 px Digital Workplace Design is more than a picture
  2. 2. # digital workplace # interactive intranet # UI/UX akravets@anromsocial.com Cell-phone, Telegram, WhatsApp: + 38 068 908 25 33 About ANROM Social Business Tech Telecom Retail & FMCG Other About me Anna Kravets CEO ANROM Social Business
  3. 3. Navigation Availability Content Search Page load time Functionality Beauty or usability? Brandbook, latest trends Icons, Images, Fonts Headers, Footers, Backgrounds
  4. 4. Beauty or Usability? Showing off on conferences Easy to sell to executives Faster processes Faster learning Easier support Higher user adoption Greater ROI
  5. 5. When “beauty” is a priority
  6. 6. Stylish look from design agency
  7. 7. After 1.5 months of reviews by executives UI on launch date
  8. 8. …in 9months after launch
  9. 9. Aesthetic-Usability Effect Paradox, when users consider more pleasing design more usable than it actually is
  10. 10. Our design fuck-up’s
  11. 11. In a red mood…
  12. 12. “designed in London” effect
  13. 13. Branded to the fullest
  14. 14. Eggs & Blossoms
  15. 15. Operation “Navigation”
  16. 16. Ideal example (not ours, unfortunately) http://www.theworldsworstwebsiteever.com
  17. 17. Best practices
  18. 18. Homepage
  19. 19. Homepage
  20. 20. Department’s page
  21. 21. Department’s page
  22. 22. Workgroup page
  23. 23. Workgroup page
  24. 24. Mobile version
  25. 25. Mobile version
  26. 26. Creative life hacks
  27. 27. Funny progress bar https://codepen.io/Errec/pen/RQYPXz
  28. 28. Playful login page
  29. 29. Forms, which don’t push away
  30. 30. How to assess design?
  31. 31. Data-driven approach. What users do? • Usability Hub • Chalkmark • Helio • Яндекс Метрика Click-tests • Usabiity Hub Navigation tests • TeamViewer • Zoom.us • Screencast-o-Matic Moderated remote usability studies • EyesDeside • Inspectlet • EyeSee Eyetracking
  32. 32. Data-driven approach. What users say? • Google Forms • Survey Monkey • Jot Forms A/B testing, Surveys • Usabiity Hub 5-second test
  33. 33. How to make cool UI design?
  34. 34. What are the inputs? Business goals UI/UX principles User feedback Budget Platform limitations Environment limitations (browsers, devices, etc.) Legal staff (personal data, labor legislation, etc.) 1 2 3 4 5 6 7
  35. 35. Gather requirements Define limitations Manage expectations – communicate limitations Create spec for UI designer Together with integrator/IT! Communicate limitations to UI designer Assess designer’s work according to requirements Assess implementability Test with users Agree with stakeholders Launch for everybody
  36. 36. Photos Icons Infographics https://www.pexels.com DIY design tools GIF animations https://www.iconfinder.com https://piktochart.com http://www.screentogif.com
  37. 37. AnnaKravets CEO ANROM Social Business akravets@anromsocial.com + 38 068 908 25 33 twitter: @AnnaKravets Thanks for attention :)

×