Purpose
The purpose of this project is to improve the UI of a client-facing intranet-dashboard for an important law firm. This case study highlights the background of the company, the use of the system, example pattern updates, and plans for a future redesign.

connectelement1

BACKGROUND
About the Company
Established in 1951, this firm is a leading immigration services provider (providing mainly legal services). The firm is widely accepted as the expert in the field of business immigration law, as they focus solely on that field, and have many decades of focused experience. Originally one office, the company has grown to over 40 offices around the world, serving countries in all regions.

Marketing
The company tagline is “a world of difference in immigration.” Another commonly used phrase in their advertising is “our world moves beyond borders.” There are a few main points in the company’s branding. First, they market themselves as experts in immigration law. Second, they put a great emphasis on doing good and opening possibilities to capable professionals all over the world (as well as celebrating diversity in race and gender both within and without the firm). And third, they pride themselves in their technology, which includes 24/7 client access to data and real-time status updates. This firm established their immigration online home page far ahead of the curve, in 1996.

SYSTEM
What is the purpose of the system?
The purpose of the technological system is to make the immigration process easier for business professionals. Immigration is a difficult and lengthy process. The immigration-specific case management system allows foreign nationals, immigration HR professionals, and employers to follow a case from beginning to end, find information, and access and submit documentation.

IHP, WWIHP, Connect
The original Immigration Home Page was established in 1996. This website served most domestic cases.
screen-shot-2015-05-15-at-11-06-19-pm
When the firm expanded to serve international clients, the Worldwide IHP was created, with significant improvements to the interface. It was never fully integrated, and only 10-12 clients currently use the WWIHP. IHP continues to serve clients in the United States.

WWIHP

Recently, a new system called Fragomen connect was developed, which is intended to bring together the domestic and worldwide systems into one. Currently, the interface needs much improvement in content and design patterns. The following pages include the homepage of each site.

Connect

Goals for Connect
The ultimate goal of Connect is to make the immigration process easier and more efficient for all involved. Ideally, the users will find the transition seamless (from either IHP or WWIHP), and will understand what their responsibilities, needs and deliverables are. They will quickly understand what is required of them, and get real-time updates on their process, as well as access to FAQs and need-to-know information. The ease of these processes will improve client satisfaction and the firm’s reputation.

USERS
User Persona

persona

User Access Needs
accessneeds

RESEARCH AND PATTERN EXAMPLES
Research Patterns

DESIGN ANALYSIS

design-analysis

UX IMPROVEMENTS

wireframe1Help Section

Problem  |   Currently, the help section needs to be relabeled and redesigned. As is evident from the screenshot below, there are a few different categories listed for help. The vocabulary used is ambiguous and unclear.

Solution: Change Language and Patterns  |   Firstly, there should be a general “help” page, which can be accessed by clicking the help button. This page will have to be split into sections, for example, “Connect System Help” and “Immigration Process Help” should include an auto-populating search function, as well as a list of questions within each section.

Secondly, to replace the “Contextual Help,” help should actually be in context. Each section will have a small icon (i) next to it, which will be activated upon clicking and bring up a small popup with help information.

Footer (Add)

wireframe2There is no footer on Connect as it stands. This is an easy and essential addition. A footer should include at least Contact, Copyright, Privacy Policy, About and Resources. IHP had an acceptable footer, but its style is outdated now. WWIHP has the best of all the footers, but it has an excess of information; the information that is found there is not extremely helpful, or expected.

Footers should be at the forefront of thought when designing a website. Many people scroll straight to the footer if they cannot find something, or even before they try to find something elsewhere.

There is room for discussion on this issue. As it stands on the new (front-facing) website, the footer is a very simple, single line. A larger footer is included as a part of the left-hand navigation menu, which appears quite handsome, and is very convenient. It is possible that there will be less need for a footer on Connect, if the content makes sense elsewhere.


Header and User Navigation (Add)

Currently, Connect implements a user header which includes the user identity (name), a strange machine identity number, and a logout button. The header also includes the Fragomen logo. One important addition to this header will be the company’s own logo. This homepage needs to feel like it belongs to them. They must feel familiar and at home when they log on.

headerold
In a better system, each company will have its own branding, and each user will have their own branding as well, i.e. their name and an image, as well as a choice of language. Elsewhere on the page there may be more customization, such as images of flags suggesting that “we at Fragomen know your case. We know that you are immigration from [UAE] to [Australia].”

header

 

Iconsicons

Problem: Icons are Not Intuitive  |   In certain places where icons are used, they don’t make sense. A great example is under the documents section of a case. Instead of using meaningful icons, the interface uses the download symbol to mean 3 different things (download, upload, and “uploaded/not uploaded yet”). It’s not entirely clear which is which.

Solution: New Icons  |   This would be an easy fix. If better icons were used, the user would know what the meaning was. Most importantly, the green and red icons would make more sense as green check marks and red x-marks. The x-marks could also be left blank until the file is uploaded. One good example from page 16 of this case study is a checklist of done items and items left to be done.

 

MOBILE AND RESPONSIVE DESIGN

As a secondary process, I created some wireframes for responsive mobile designs.
mobile wireframes

FINAL NOTES

IHP, WWIHP, and Connect are all groundbreaking systems, which have and will continue to revolutionize the world of immigration processes. In 1996, when IHP was invented by a firm employee, there were no known online systems for tracking the immigration process. This has kept the firm at the forefront of professional immigration services and technology. To stay in this position, there is much growth that must happen in the near future within the firm, most notably in regards to professionalism and functionality within the client-facing intranet. This case study has outlined the current position and major first-steps in updating and redesigning the interface of Connect.