SafeXpress website — a UI/UX case study
A showcase of the redesign of SafeXpress website.
Disclaimer: This is a project done for my design school project in collaboration with shubh sethiya and has not owned or made for SafeXpress. All the images are taken from SafeXpress website/ Unsplash.
The brief :We were asked to chose a brand/service and redesign the interface of SafeXpress website with a core UX study about it. Our solution must include a new feature that is user friendly.
Methodology
- Team: 2 Students from the same batch
- Software: Adobe Photoshop, Adobe Illustrator, Adobe XD, Google forms, and Google meet.
- Techniques: Survey, User interviews, wire framing, Prototyping and User testing,
What is SafeXpress?
SafeXpress is a logistics company widely acknowledged as the ‘knowledge leader’ and ‘market leader’ in Indian supply chain & logistics industry and offers customized and competitive logistics solutions. There vision is
“to become the most preferred partner to provide a single window solution for entire supply chain and logistics needs of our esteemed customers pan India and thereby, contribute to their as well as country’s growth through our impeccable, continuously evolving strengths & expertise, and maintain the established ‘knowledge leadership’ and ‘market leadership” in the industry”
Even though it is among the top logistics companies in India it lags behind when it comes to its website’s user interface. We conducted a User Experience (UX) study and observed various issues with the existing interface and remodeled the website so as to cater to the users’ needs better.
RESEARCH
The first step was to analyse different stakeholders, competitors, SWOT analysis, different needs of the brand vs customer and learn about the existing interface.
Stakeholders
While conducting the brand study we identified and examined the various stakeholders of the company. These were:
- The Management- All the founders and directors of the company, along with all its employees, ranging from the delivery personnel to the laborers.
- Investors- Entities that have invested in the company.
- Customers- Entities who use the service rendered by Safexpress. These include various companies in industries such as Apparel and lifestyle, Automotive, Books and periodicals, FMGC, healthcare and so on.
4. Other stake holders: Creditors, debtors etc.
S.W.O.T Analysis
Next we conducted SafeXpress’ SWOT analysis to identify and analysis its internal strengths and weaknesses, as well as its external opportunities and threats.
Strengths:
- Credit and Retail basis pricing strategy
- Good brand presence in India
- It has great amount of creative service ideas
- ‘Largest Logistics Service Provider in India’ by Limca Book of Records in 2002
- Has a reach to all 627 districts in 35 states and union territories in India.
- It possesses more than 3600 GPS equipped ISO-9002 certified weather proofed containerized vehicles.
Weakness:
- Marketing and advertising is less aggressive than other competitors.
- Lower adoption of advanced technology
Opportunities:
- Diversification in more innovative services
- The increasing number of firms in the manufacturing industry could bring more business.
- Better resource allocation
Threats:
- Big competitors with advanced technology
- Increasing market saturation.
- Unorganized transportation sector offers comparable services at cheaper rate.
Competitor Analysis
The top three competitors of SafeXpress are:
- Gati — Gati is an Indian multinational courier delivery service company. It is known for supply chain solutions with express distribution. Gati has offices in all major cities of India, with presence in Singapore, Hong Kong, China, Nepal and Thailand also.
- BlueDart — BlueDart is an Indian logistics company providing courier delivery services. It has a subsidiary cargo airline, Blue Dart Aviation that operates in South Asian countries.
- DHL — DHL is a German courier, parcel and express mail service company which is a division of the German logistics company - Deutsche Post DHL. It serves in 1200 locations in India.
Brand need VS the Customer need
After careful observation we arrived at the brand’s UX needs as well as those of the customers.
Brand
The website should be informative. There should be good connectivity across the country and should also have the brand recognition recognition in the logistics and transport market. SafeXpress should be known for its fast and secure delivery and reliability.
Customer
Customers wants Safe, trustworthy and fast service available in the most remote areas across the countries.
The Existing interface
Problems
- Even though the website is quite informative lacks simplicity in terms of navigation.
- The primary banner image on the homepage makes the first impression of the website unattractive. The website also has with poor grid and alignment.
- Poor use of color, typeface and grids.
- There is no Contact us information on the homepage.
- The homepage has unnecessary repetitive information.
- The website is not customized for mobile phones.
- The photographs and info graphics used are of poor quality
- The main services mentioned on the homepage (Track shipment, branch locator, virtual cargo, search by pin code etc) are not prominent.
IDEATION AND DEFINITION
Using the results from the user survey, we started defining our website by making Information Hierarchy, Navigation Flow, Wire frames and Prototype.
Information Hierarchy
- Track Shipment
- Pin codes served
- Branch locator
- Pickup request
- Virtual Cargo
- Book/Pay Online
- Service for Individuals/SME
- Service for Enterprise
- Express distribution
- GST support
- Contact us
- Network
- Join us
Navigation flow
Style Guide
Wire frame
Wire frames are the skeleton view of the app that allows me to focus on key functions, elements and actions before giving life to the frame.
Here are the wire frames of few of our pages where we improved grids and alignment. The overall look of the website was changed, working on buttons, icons and drop down menus.
Prototype
Prototypes are one of the most important steps in the design process. The prototype consist of the basic look of our website.
What have we changed in the UI of the website?
The very first look of the website is made simple and user friendly by using subtle colors, typeface and using more of white space. The buttons are given curve and also hover effects. The four most important features of the website is shown on the homepage to reduce the navigation time of the users. There are 6 icons added to the right side of the page namely, Contact us, About us, Pickup request, Customer portal, Newsroom and Business Query. The track shipment interface is changed completely.
New feature added
We are always concerned about where our courier has reached, SafeXpress had a feature where it showed which warehouse our courier has received but users want to see the live GPS tracking. We have added a feature where user can track their courier by accessing google maps.
The website is made mobile compatible
We also added a service where SafeXpress will now be delivering small couriers and documents.
Conclusion
This project has been one of the most challenging projects that we have worked on so far. Since this was our first UX related project, we have numerous takeaways from it. The learning curve has been a greatly interesting one, owing to the experimental and practical nature of the project. Analyzing a company and figuring out how we could develop design and UX solutions in order to enhance the user experience has enabled our classroom learning to transcend its four walls.
A collaborative project by:
