Skin & Enhance a Forex Trading System
October 2010
The brief for this project was to provide the project team with an assessment of the in-development build of a new foreign exchange trading system, and to provide design recommendations.
BEFORE: Main screen showing a payment-request being added to a payment shcedule (to support getting a quote for multiple payment requests at one time)
BEFORE: The Add Beneficiary screen. The Bank Search feature was very confusing and made it difficult to find a bank by name or by using a SWIFT code (which would be a key identifier known by customers)
BEFORE: Marked-up image with indicators of the various usability issues with this screen. For example, #5 concerns the display of more information (the blue speech bubble) when the customer hovers their mouse over the link text. This is a problem for customers who do not use the mouse for input (keyboard, touchscreens). Additionally, link text in a list like this would conventionally take the customer to a detail page for that item.
Among the many suggest changes, the most significant were in the presentation of quote information and the way beneficiaries are added/found.
AFTER: Using the appropriate style guide, the page is much cleaner. Text is a more appropriate size. Buttons are clearly labeled and identifiable.
AFTER: Here, a quote overlay (dialog) is shown which highlights the salient information, allowing the customer to make a decision within the 15 seconds that the quote is valid for. The Accept button is highlighted to indicate that they will be submitting the payment request if they proceed.
AFTER: The revised Add Beneficiary screen. Finding the Bank Details of the beneficiary will be much easier now that the full search behaviour has been exposed. Note also that mandatory fields are indicated and common form conventions are used (help icons, consistent field names, clear headings, etc)
