A web relaunch project that evolved into three separate projects because we have identified what our client and their users need: A functional website, a customer portal, and an online mapping tool to connect internal data system with both of them.
Unorganized Product and Information Structure
Unorganized Internal Files and Information Structure
Inconsistent Online Presentation
– Qualitative analysis
– Competitors analysis
– Business Needs
– Technical Constrains
– User Stories
– User Flows
– Standup Meetings
– Feedback rounds
– Design Correction
We were working closely with the stakeholders: our client and their users. User Interview was one of the first parts that we did to understand their behavior, workflow, expectation, pain and also love points.
We were also looking closely at data that has been gathered by the website over the year and decided which pages needed optimization and which browsers we still need to support in the next roll-out.
We created Personas as a tool that helps us designing the experience. At the end the end products are for them, and not us.
We looked at how complex the workflows were and how the systems worked together and tried to simplify it without sacrificing any functions.
We have learned that users do quick research using their phone. Thus we provide only the most important information at a glance for our mobile users. Whenever they needed to go into detail, they will use their desktop or laptop. This finding helped us shaping a better experience for anyone browsing the website using small or wide screen.
Beside user interview, we also looked at the real data regarding user browsing habits and such using Google Analytics.
Since we wanted to improve the mobile experience, we tried to apply the finding of the following thumb analytics for easier navigation.
We wanted to abolish E-mail as a platform of communication since it’s out-dated, not user-friendly at all, hard to backtrack, and has other lots of limitation.
With the new Customer Portal we provide a haven for both users and technical assistants to collaborate on their projects without thinking about data storage, availability and actuality.
A Wireframe of a page helped us prioritizing information and functions in a single page. Interface Design cemented the concept that was created in the wire framing phase.
With the help of the customer portal that is packed with functions that people really need, we help them to finish their tasks effectively and efficiently.
Mapping Tool helps keeping files and information on the website and customer portal up-to-date. Before the files needed to be uploaded manually to the CMS to update them, and then any users that have requested the file in the past sometimes were notified separated per E-Mail by the customer support.
The management of content now takes place in one place only, thanks to the mapping tool.
It was one of our 2019 highlight projects and one of my most hardest and complex UX and UI project yet. I spent most of my time researching and asking questions since surface drainage system was an alien topic.
I learned a lot how a simple thing like drainage system that we barely see also has a very important role in our life. This website is aimed to bring market visibility and thus also revenue to our clients, but we also want to ease the complex works of our personas: specialist planners, architects and investors.