I Did

• User Experience

• UI Design

The Vision

Considered a traditional news source, Al Arabiya wanted to focus its efforts on not only rebranding its identity, but also defining the values around which the experience is based. We wanted our experience to hold value in four key areas:

• Efficiency

• Ease of use

• Trust

• Frequency of use

We used these values to shape the feature list and product backlog we were about to create.

Our marketing and branding teams worked with an external agency to define the values that they wanted to communicate in our brand

Workshop

A design thinking workshop was conducted with various Al Arabiya employees including stakeholders, developers, journalists and designers like myself. The purpose of the workshop was to get everybody on the same page about the design thinking process.

The participants of the workshop were divided into four groups, each of which was tasked with identifying a persona and developing an as-is user journey for them. Once this was done we proceeded to define a problem statement for each persona.

We then created an empathy map for each persona and suggested various features that might impact what users think, feel, do and say. Once we built out a large, unfiltered feature list, we began grading them in terms of impact and feasibility of implementation. This allowed us to assign a weight to each feature, making it easier to identify features that were no-brainers from those which could be kept for later.

At every step of the process, each group played back highlights of our thought process and our output to all participants, ensuring discussion and cross-team involvement.

Design thinking workshops are a great way to remove gaps in the design process, particularly between stakeholders and design teams

The Garage

For three weeks, we worked with the team at IBM iX on the UX, UI and prototyping. With a great environment for creative thinking and collaboration, I spent the three weeks at their office, along with Al Arabiya product and project managers.

Week 1 involved the collation of our findings from the design thinking workshop. The key output from this was an exhaustive list of around 100 features that we needed to sift through and prioritize. We also began drafting rough user journeys based on the personas that we had created in the workshop. Based on the brand experience values that we had defined - Efficiency, Ease of use, Trust and Frequency - we began evaluating and restructuring the feature list. At the end of the week, we had identified and put together a list of 40 features that we agreed had a high weight based on impact, feasibility of implementation and our brand values.

Collaborating so closely with IBM on this project gave us the space to have ownership of the project at every step of the way

Wireframing and Prototyping

During the second week of the garage, we proceeded to the create wireframes, using the user journeys as a guide for our thought process. We created four user journeys and wireframed them out using Sketch. In parallel, we began looking into UI exploration, particularly for navigation.

As we progressed through the week, and we felt more confident in our wireframes in the context of their journeys, we began expanding them to include the end-to-end flows for specific features. We also gradually introduced the UI explorations into our wireframes to see how they might look in the wild. By the end of the second week, we had a vast library of designs and wireframes, all including several user flows that we could now start validating with users.

We conducted a user feature test with a group of 8 users to gather feedback on the output that we had generated. Once we collated their feedback, we identified a few key areas that needed to be updated in the next iteration.

With these changes in place, we began prototyping a mobile application and desktop web interface using Sketch, FramerX and InVision. At this stage, the frontend tech team came in to also build out simple components that could be incorporated easily into the actual products.

Defining user journeys and flows helped us create a narrative around the use cases for the redesigned products

Work in Progress

Over the coming months, we will run through iterations of this project with stakeholders and release a brand new experience for Al Arabiya.