How to Enable High Contrast Black Theme in Fiori Cloud Edition - Accessibility & Fiori

Back in August I wrote a blog on the importance of the High Contrast Black Theme: Accessibility & Fiori - High Contrast Black theme

Picture my dismay when I attended a Fiori Cloud Edition workshop at Teched 2015 Las Vegas only to find the High Contrast Black theme did not appear to be available to Fiori Cloud edition users!

Having raised my concerns with Mr. Fiori Cloud Edition himself - Aviad Rivlin - he's kindly provided the answer and permission to reproduce it for all those interested in Accessibility.

Now if you haven't had much to do with Fiori Cloud Edition, it's worth noting that a lot has been done in the Cloud Edition lately.  Not only is the Cloud Edition now available for productive use - SAP Fiori Cloud Edition is now available for Productive Use!  - you can also use the trial edition - SAP Fiori, Demo Cloud Edition - to test out this technique for yourself.

By default, Fiori Cloud Edition is set to the standard Blue Crystal theme.  Here's an example showing the Team Calendar from the trial edition.

Although it appears as if only the Blue Crystal theme is available, High Contrast Black theme has been pre-loaded.  All you have to do is enable it for user selection. 

To check if High Contrast Black has been enabled for user selection, the steps are as follows:

1. Login to your Cloud Edition account as normal
   

   Note: If you want to use the trial edition, you need to be in the Customize and Extend area where you can adjust the trial to suit your requirements. So to get there you will need to go firstly to SAP Fiori, Demo Cloud Edition, select "See it in action", then "Customize and Extend", then "Get Started".

2. Look at the menu options in the top right hand corner. You can check if High Contrast Black is already available by checking the Themes available in your User Preferences.
3. Select Theme to see what other themes are available.  If you haven't adjusted your themes yet, it will probably look like this - i.e. a choice of Blue Crystal only :

If High Contrast Black theme is not available in the User Preferences, you can make it available for selection by proceeding as follows.

1. Select Options
2. Select Customize Theme
3. Select an app, e.g. Fiori Launchpad
4. Select Manage Themes
5. Select the SAP High Contrast Black theme
6. In the Theme detail, select the button Enable User Selection

You have now enabled the High Contrast Black theme. To test that this is working, return to your main launchpad page - where you first logged on to your account.

1. Select User Preferences
2. Select Theme
3. Select High Contrast Black theme and press Save 

You should now be using High Contrast Black theme.  For example the Team Calendar app we showed before should now look like this:

And there you go!

By the way, if you prefer to look at a video Aviad has also kindly provided this one... (no sound, just the steps)... Enable HCB Theme - YouTube

If you are interested in understanding more about Fiori Cloud Edition and theming then these blogs are also helpful:

Enable End-Users to use their own Custom theme

Fiori Launchpad Custom Theme - UI5 Version alignment