{"id":8506,"date":"2015-03-19T05:55:55","date_gmt":"2015-03-19T12:55:55","guid":{"rendered":"http:\/\/localhost\/exoblog\/?p=8506"},"modified":"2015-03-19T05:55:55","modified_gmt":"2015-03-19T12:55:55","slug":"discover-the-freshly-updated-exo-ux-guidelines-a-new-dark-theme-and-tons-of-updates","status":"publish","type":"post","link":"https:\/\/www.exoplatform.com\/blog\/discover-the-freshly-updated-exo-ux-guidelines-a-new-dark-theme-and-tons-of-updates\/","title":{"rendered":"Discover the freshly updated eXo UX Guidelines: a new dark theme and tons of updates"},"content":{"rendered":"<p><a href=\"https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/UXGuidline_2.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-8512\" src=\"https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/UXGuidline_2.jpg\" alt=\"UXGuidline_2\" width=\"650\" height=\"220\" srcset=\"https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/UXGuidline_2.jpg 650w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/UXGuidline_2-300x102.jpg 300w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/UXGuidline_2-500x169.jpg 500w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/UXGuidline_2-360x122.jpg 360w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/UXGuidline_2-200x68.jpg 200w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/UXGuidline_2-100x34.jpg 100w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/UXGuidline_2-70x24.jpg 70w\" sizes=\"(max-width: 650px) 100vw, 650px\" \/><\/a><\/p>\n<p>Since <a href=\"https:\/\/github.com\/exoplatform\/ux-guidelines\" target=\"_blank\" rel=\"noopener\"><strong>eXo UX Guidelines<\/strong><\/a> was originally published, it has become a useful reference for anyone wanting to test or build an app in the style of eXo Platform. The guideline has been updated with all the changes for eXo Platform 4. Today, we are happy to announce an updated version of eXo UX Guidelines including the dark theme <a href=\"https:\/\/www.exoplatform.com\/blog\/deep-look-at-the-new-skin-module-feature-in-platform-4-2\/\">that was presented a few weeks<\/a> ago along with the skin customization feature.<br \/>\n<!--more--><br \/>\n<a href=\"https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/01-UX-Guidelines-Website.png\" class=\"broken_link\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-8507\" src=\"https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/01-UX-Guidelines-Website.png\" alt=\"01-UX-Guidelines-Website\" width=\"570\" height=\"380\"><\/a><\/p>\n<p>Thanks to the eXo skin customization feature, it is possible to build a skin add-on with any theme style. <a href=\"https:\/\/docs.exoplatform.org\/\" target=\"_blank\" rel=\"noopener\">A set of dedicated variables can be customized to reconfigure all our main colors and backgrounds.<\/a> This feature makes it easy to personalize the platform overall in a few steps. eXo UX Guidelines with the dark theme option is a real illustration for what we can customize with eXo Skin.<\/p>\n<p>In <a href=\"https:\/\/github.com\/exoplatform\/ux-guidelines\" target=\"_blank\" rel=\"noopener\"><strong>eXo UX Guidelines<\/strong><\/a>, there are two options, Default Theme and Dark Theme, which are located at the top right of the site. To change the theme, simply click on your theme options and the site style will be changed correspondingly. With the dark theme option, all UI components and patterns are displayed in a dark style following the variable and icon changes.<\/p>\n<p><a href=\"https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/02-UX-guidelines-news.png\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-medium wp-image-8508\" src=\"https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/02-UX-guidelines-news.png\" alt=\"02-UX-guidelines-news\" width=\"570\" height=\"380\" srcset=\"https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/02-UX-guidelines-news.png 570w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/02-UX-guidelines-news-300x200.png 300w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/02-UX-guidelines-news-492x328.png 492w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/02-UX-guidelines-news-354x236.png 354w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/02-UX-guidelines-news-197x131.png 197w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/02-UX-guidelines-news-100x67.png 100w, https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2015\/03\/02-UX-guidelines-news-45x30.png 45w\" sizes=\"(max-width: 570px) 100vw, 570px\" \/><\/a><\/p>\n<p>The new version of eXo UX Guidelines has been updated with a <a href=\"https:\/\/github.com\/exoplatform\/ux-guidelines\/blob\/develop\/getting-started.html#file-structure\" target=\"_blank\" rel=\"noopener\">new file structure<\/a> that completely matches the eXo Skin file structure. It is easier to maintain and update. There is a set of alternative icons and image collections including in red, green, blue, pink and orange, which are available for advanced customization.<\/p>\n<p>See here how <a href=\"https:\/\/github.com\/exoplatform\/ux-guidelines\" target=\"_blank\" rel=\"noopener\">eXo UX Guidelines<\/a> looks with the dark theme. <a href=\"https:\/\/github.com\/exoplatform\/ux-guidelines\" target=\"_blank\" rel=\"noopener\">Discover it now<\/a> and do not hesitate to <a href=\"https:\/\/community.exoplatform.com\/portal\/g\/:spaces:ux_guidelines\/ux_guidelines\" target=\"_blank\" rel=\"noopener\">share your feedback<\/a>.<\/p>\n<p><b><a href=\"https:\/\/community.exoplatform.com\/portal\/dw\/\" target=\"_blank\" rel=\"noopener\">Join the eXo tribe<\/a> by registering for the community and get updates, tutorials, support, and access to the Platform and add-on downloads!<\/b><\/p>\n<p><!--begin adv-events--><\/p>\n<div class=\"adv-events\" style=\"background: #476fad; padding: 30px 20px; color: white;\">\n<div class=\"media\">\n<div class=\"pull-right\"><a href=\"https:\/\/www.exoplatform.com\/contact-us\/\"><br \/>\n<img decoding=\"async\" loading=\"lazy\" class=\"size-full wp-image-6587 alignright\" src=\"https:\/\/www.exoplatform.com\/blog\/wp-content\/uploads\/2014\/02\/how-to-make-the-most-of-eXo-platform41.png\" alt=\"make-the-most-out-of-eXo-platform4\" width=\"161\" height=\"85\"><br \/>\n<\/a><\/div>\n<div class=\"media-body\">\n<h4 class=\"media-heading\">Make the most out of eXo Platform 4<\/h4>\n<p>Register to the next weekly live demo session and get a complete overview of what you can do with eXo Platform 4. <strong><a href=\"https:\/\/www.exoplatform.com\/contact-us\/\">Reserve your seat now!<\/a><\/strong><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p><!--end adv-events--><\/p>\n","protected":false},"excerpt":{"rendered":"Since eXo UX Guidelines was originally published, it has become a useful reference for anyone wanting to test or build an app in the style of eXo Platform. The guideline has been updated with all the changes for eXo Platform 4. Today, we are happy to announce an updated version of eXo UX Guidelines including [&hellip;]","protected":false},"author":7,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[699],"tags":[],"lang":"en","translations":{"en":8506},"pll_sync_post":[],"_links":{"self":[{"href":"https:\/\/www.exoplatform.com\/blog\/wp-json\/wp\/v2\/posts\/8506"}],"collection":[{"href":"https:\/\/www.exoplatform.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.exoplatform.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.exoplatform.com\/blog\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.exoplatform.com\/blog\/wp-json\/wp\/v2\/comments?post=8506"}],"version-history":[{"count":0,"href":"https:\/\/www.exoplatform.com\/blog\/wp-json\/wp\/v2\/posts\/8506\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.exoplatform.com\/blog\/wp-json\/wp\/v2\/media?parent=8506"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.exoplatform.com\/blog\/wp-json\/wp\/v2\/categories?post=8506"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.exoplatform.com\/blog\/wp-json\/wp\/v2\/tags?post=8506"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}