Orange portal revamp, example 'Film' section in 'entertainment'

I have worked several times for Orange on Wap, Web and convergent projects.

Brief:
This project brief covered several aspects: on the one hand the brand is actively involved in large scale entertainment events, sponsoring movies, film festivals and music concerts. On the other hand, the Orange portal runs an a CMS, that gives limited support for rich media solutions. The brief was to revamp the portal so it would represent the Orange brand more contemporary, stylish and closer to the off-line brand, while still minimising download times, which are forever too long for an impatient entertainment oriented audience. In addition, social media elements, such as with ratings, user reviews, comments and videos, needed to be integrated.

Answering the brief:
This was achieved by implementing 3rd party software (blog software) which had to comply to the same brand guidelines. At the same time this was a convergent solution, e.g. it runs on the mobile UMTS internet, so attention had to be paid that all elements could easily be re-architected for a mobile browser agent and much smaller screens. Also provision was made for mobile video clip uploads a la ‘YouTube’.

My impact
My role as user-experience consultant was to translate the brand guidelines into a design concept that would work for the CMS system. In this function I liased between CMS and web development, 3rd Party envelopers, and graphic design. To keep the page weight down we opted for a Flash solution for larger rich media panels. All flat colours, backgrounds and headers type faces are coded in CSS. To distinguish user generated content from Orange content I developed a subtle visual sub-language for the UGC components, which complied with Orange secondary brand colours. Also a consistent mark-up for all link structure was developed, as well as help and attention elements. I always found that a consistent mark-up and interface elements guidelines have great similarities with consistent brand guidelines, therefore that translation seem natural to me.

Accessibility and legibility
I also pay attention to aspects like on-screen legibility, and micro-typography in on-screen scenarios (e.g. bold type faces’ the tracking needs to run wider). Image manipulation includes settings the best compromise between compression modes and image quality. I also consider general accessibility standards to DDA 2 level (in particular when it came to the flash modules), compliance for screen readers, and other alternative web consumption modes while keeping the brand experience consistent (All ‘alt’ descriptions, etc, are still coded to appear visually ‘on brand’). The complete scope covered about 40 new templates.

Old CMS template and component style:


Design execution Orange in-house design team







Client: Orange
Year: 2006/7