Shell | Customer Chemical Portal
Project Kick Off: Settting the Stage
Leading User Interface design development of responsive Salesforce-based e-commerce Shell Customer Chemical Portal for the purpose of ensuring existing clients about the continuation and improvement of quality of the service and product and further expanding clients database. Responsible for creating the structure of the website, defining how users interact with the product and application of existing pattern Shell styling library.
My work was based on previous research done by the Shell research team. They conducted user surveys, competitor analysis and existing content audits prior to my arrival. My job was to rely on the findings and continue the visual side of the project.
www.chemicals-customer-portal.shell.com (login required)
Disclaimer: This case study is for the purpose of the portfolio presentation. Some data or events may not be entirely accurate.
The original portal was outdated and the feedback the Shell research team received was not very positive, hence the decision to totally revamp the website.
- Creating meaningful relationships between customers and product
- Improving interface design to make it easier for a customer to purchase chemical products
- Create purposeful navigation without broken links and make sure that important information about chemical use and transport is easily accessible
- Applying existing branding guidelines throughout the site to reflect the quality and high standard of Shell
Who are the users
Business users are non-technical users in the IT sense who access business accounts that are considered privileged as part of their daily responsibilities. Their day to day job is to ensure the continuation of existing interaction within their organisation and part of that includes often visiting Shell Chemical Portal.
Based on limited data about users I felt it would be the best to get all stakeholders, including researchers, into a workshop extract as much as possible information on a lean canvas. The important thing to note is that the canvas is based on assumptions from all people who created it so I had to regularly revisit and update the canvas based on new upcoming information about users and business.
I used existing content audit data in excel and wrote all of it on sticky notes. With a help of colleagues and lean canvas we were able to map the site.
After the meeting, I have created the full map of the website which was signed off before I started working on the user journey.
Categorising user journey
Before the user journey was created it was important to understand what part of the portal have priority, what was used the most by the customer and what Shell would like to put forward as important, such as information about chemicals.
Finally, after few days the customer journey was created. My team had several meetings until the user and business needs were met.
It was a time to zoom into the journey and start working on wireframes. I first designed some rough sketches of the portal.
After the basic pencil wireframes were approved the higher fidelity wireframes were created. As we were analysing the layout further changes were done before the stakeholders were satisfied with the layout. Of course, it would be very beneficial to test the designs at this stage but time constraints were an issue for the Shell team and I accepted that some decision about the layout was decided by the major stakeholders. After all, they knew the business well and some parts of the portal, as mentioned earlier, such as chemical information and transport were given priority due to the nature of material.
Visual design and application of branding
These visual designs are made by strictly following Shell branding guidelines. After the designs were approved, I lead a team of India based developers for a further two months to make sure that portal development was following approved designs.
The site was fully developed and the launch was few months after I completed my assignment. Few things I wish I could have:
- User testing - I feel that is important to test the product before launch. The Shell internal team decided that the portal was good enough to go live. It seems to me that they were right. The portal is still operating successfully.
- We could use the exiting Shell pattern library, but the Salesforce developers could not apply to the portal. If they could find the solution, the portal would take less time to develop.