Lexicon Update 2017

Lexicon is evolving to better fit the need of Liferay users and correct interactions from the past that needed improvements. The work in this slides is not definitive but is the way we are following for a better definition of Liferay DXP interfaces.

This presentation is given by two people Juan Anton and Victor Valle but many Liferay workmates have contributed as Emiliano Cicero, Juan Hidalgo (from Lexicon Team) and designer from the different multifunctional teams.

Transcript

1. Lexicon Evolution Víctor Valle Juan Antón !
2. 1. UX Design Team 2. Updates & News 2.1. Accessibility 2.2. Forms 2.3. Dataset Display 2.4. Charts 3. Lexicon for sites 4. Lexicon + Clay Index
3. 1. UX Design Team
4. Liferay.Browser={acceptsGzip:function() {return!0},getMajorVersion:function() 61},getRevision:function() {return”537.36”},getVersion:function() {return"61.0"}, isAir:function(){return! 1},isChrome: Not only an awesome coders company anymore ,isSafari:function() 0},isSun:function(){return!1},isWebKit: {return!0},isWindows:function(){return!
8. Designers will conquer Liferay ,
9. 2. News & Updates
10. 2.1. Accessibility
11. New colors, better contrast ratio 4.5:1
13. Accessibility
14. Accessibility
15. 2.2. Forms
17. Forms / Fields
18. • Consecutive-embedded form sections • It is difficult to find sections • Tasks become long and time consuming • If I commit several errors in the form, I can feel stressed Forms / Form Length
19. Forms / New Structure & Navigation
20. 2.3. Dataset Display
21. Dataset Display dataset display table image
22. Dataset Display / Search
23. Dataset Display / Search
24. Dataset Display / Search
25. Dataset Display / View Change
26. Dataset Display / View Change
27. Dataset Display / Cards
28. Do you remember how to add an element into a dataset??? Dataset Display / Plus Button
31. Dataset Display / Plus Button
32. Who knows how to select all elements in a dataset??? Dataset Display / Select All
34. 623 files 20 items 32 pages DATASET PAGE SIZE TOTAL / = 32 PAGES * 2 CLICKS/PAGE - 1 63 Clicks to select all
36. Dataset Display / Select All
37. 2 Clicks to select all!!
39. Dataset Display / Table
40. Dataset Display / Table / Row Hover
41. Dataset Display / Table / Drag & Drop
42. Dataset Display / Table / Columns Visibility
43. 2.4. Charts
44. Charts
46. 3. Lexicon for Sites
56. …too / Modern Site Building “Make Liferay the best website builder and CMS platform on the market”
57. Lexicon for Sites
58. • Improving the information architecture of the portlets. • Creating better defined content hierarchies. • Providing greater flexibility through helping building modular components.
59. • Giving more personality and differentiation to applications. • Building visually more attractive and up-to-date interfaces. • Creating an environment in which you would like to work.
60. Lexicon for Sites 24 24 24
61. Lexicon for Sites 24 24 24 24
62. Lexicon for Sites Widget toolbar Widget Content 24 24 24 24
63. Lexicon for Sites WIDGET TITLE WIDGET TITLE Subscribe
    Add Blog Entry 
64. Lexicon for Sites Title toolbar Basic Metadata Content Social Toolbar WIDGET TITLE Subscribe
    WIDGET TITLE Add Blog Entry  24 24 24 24 12
65. Lexicon for Sites Title toolbar Basic Metadata Content WIDGET TITLE Subscribe
    WIDGET TITLE Add Blog Entry  This is Blog Entry Example One David Aragonés Otero Sep 25 - 3 Views  DA This helps in creating a more dynamic web site: you can place user-created wiki entries, blog posts, or message board messages in context with your content. You’ll examine some of the Asset Publisher’s features next. As you create web content, it’s important to keep in mind that to Liferay Portal, the pieces of content are assets, just like message board entries and blog posts. This allows you to publish different …  Share  27  5 min  3  24 24 24 24 12 Social Toolbar
66. Lexicon for Sites WIDGET TITLE Subscribe
    WIDGET TITLE Add Blog Entry  This is Blog Entry Example One David Aragonés Otero Sep 25 - 3 Views  DA This helps in creating a more dynamic web site: you can place user-created wiki entries, blog posts, or message board messages in context with your content. You’ll examine some of the Asset Publisher’s features next. As you create web content, it’s important to keep in mind that to Liferay Portal, the pieces of content are assets, just like message board entries and blog posts. This allows you to publish different …  Share  27  5 min  3 
67. Lexicon for Sites
68. Lexicon for Sites
69. Lexicon for Sites
70. Lexicon for Sites
71. Lexicon for Sites
72. Lexicon for Sites
73. Lexicon for Sites
74. Lexicon for Sites
75. Lexicon for Sites
76. Lexicon for Sites
77. Lexicon for Sites
78. Lexicon for Sites
79. 4. Lexicon + Clay
81. Clay
82. Lexicon is a user experience language and interface design system. 0
83. Lexicon is a user experience language and interface design system. Clay is the implementation of Lexicon. 0
84. Lexicon is a user experience language and interface design system. Clay is OUR implementation of Lexicon. 0
85. Lexicon Clay
86. Summarizing • Accessibility • Forms • Dataset Display • Charts • Lexicon for Sites • Lexicon Site • Clay Site
87. Thanks!!1
88. Liferay Community #lexicon @Liferay_Lexicon @victorvj06 @mundotw