Gulf News
Media & Entertainment
Web Design
Project Type

Financial Widgets

Prototype designed financial widgets for one of the leading news websites in the region.

gulf news financial widget case study

Financial Widgets


Gulf News a daily English language newspaper published from Dubai, in the United Arab Emirates appointed Prototype to design financial widgets for one of the leading news websites in the region.

The widgets had to be in line with the design guidelines and be optimized for a high traffic news website receiving millions of impressions per month. The design process started with wireframes which would outline the overall functionality of each widget and was followed by a detail design phase which focused on a highly integrated and optimized design, especially from a load time perspective. While some elements where derived from the design guide of, the design required attention to detail and pixel perfection across different web browsers. The user would also have to access the information as fast as possible using rollover behavior and AJAX search.

gulf news financial widget design

How it works

Realtime Updates

Users start with an overview of the top financial indicators in the region, including regional and international markets, commodities and currencies.

By interacting with the widget, users can go from a simple overview, to a chart, to complete detailed information about any item. Users can also search stocks from the Dubai and Abu Dhabi markets, by simply starting to type a stock symbol or company name. Full details of every stock are available with a simple click.

gulf new website ui design

The Process

Technical Implementation

The client had a clear idea of what financial information had to be displayed on each widget.

Since this was defined, we started the visual design process and in parallel, we began the programming of a server proxy application to consume and process the data feeds coming from the financial data providers in the most efficient way. After the designs were approved, a functional XHTML mockup was created and tweaked according to the client's suggestions while the backend was being finished. Finally, the XHTML was integrated with the backend proxy and the Javascript UX was finalized, to be ready for a beta test with the client. The beta version was refined into a production-ready version and launched as per the planned dates.

Experience it live

Tell us about your next project and receive a free consultation

Through a short initial consultation, we can help you create detailed requirements for your digital project. Our experts can help you save costs, avoid common pitfalls, and utilize the best methodology to achieve your objectives. Get in touch to discuss your project today.

Thank you for contacting us. We will reach out to you within 24 hours.
Oops! Something went wrong while submitting the form.