Hossam Elbialy's profile

Alhurra Website UI/UX

Alhurra is a 24/7 Arabic-language television networks that provide news and analysis to more than 17.5 million viewers each week. Its in-depth discussion programs provide points of view from throughout the region and the U.S.  

Alhurra is part of MBN which operates under a grant from USAGM (US Agency of Global Media).



Alhurra font family was created 20 years ago, although, this font has been a main element of the brand identity, the font nowadays doesn’t satisfy all the needs and requirements considering the variety of screen sizes specially the handheld ones.  

The challange was to improve the readability of existing font through tweaking the letters and characters of the font. In addition, there was an urgent need to come up with two more font weights, since a single font weight was not enough for web needs.   

There was many of charachters missing out of this font and we also needed to create the numbers in the Arabic form as they were missing as well.  

This required a lot of research and special design skills to fix, and test all of these issues and make sure everything is consistent and works on the different screen sizes. 






I was aiming to create better experience for users by starting the design process from the smallest of screens: mobile. Designing and prototyping our website for mobile devices first helped us ensure that our users' experience is seamless on any device.  

Knowing that mobile internet usage has surpassed desktop usage in general and specifically 80% of our traffic coming through mobile devices, I was able to convince everyone in the team that mobile-first design is a must.  

Responsive designs helped us to greatly reduce users’ operations like panning, zooming and scrolling when browsing the website on different screen sizes. 




In order to encourage people to join the conversation, we decided to promote the top comments and help people to read what others say. This helped to reflect our editorial transparency which increased trust of our audience and improved the website traffic.




Highlighting the share function at the top most visual part of the story made it easy for people to share more of our content on their social media accounts which is a free promotion for our content.  

Making comments possible on articles and stories, encouraged people to join the conversation and helped them to read what people think of what’s happening around them.  

Promoting related articles helped people to find interesting content based on what they read which improved the traffic and helped us to reduce the bounce rate.


Prototypes were created in inVision to essentially allow the stakeholders to see what the final website will look like early before the development team starts work on the code, which helps to reduce the development cost and increases the chances of its long term success.   

The key reason was to get the management approval as well as getting feedback from end users to make sure everything is going in the right direction.  

It helped us to catch design errors early, implement valuable feedback, and improved collaboration and communication with our development team.






Thank you!

Alhurra Website UI/UX
Published:

Alhurra Website UI/UX

Published: