What We've Done
The old website was build using wix.com, which set quite some limitations on layout customizations toward the client's business goals. In order to strengthen their online presence, and at the same time promote their business effectively, they needed to update their website to reflect the spirit of a modern, innovative company.
In this project, I was mainly in charge of the UX design, while another UI designer took care of the visualization.
Create Personas
Back to the messages that the client wants to deliver thought the new website - they’re not only a provider of competitive products, but also capable to provide customized solutions for their potential business partners, which indicated their target audience.
Therefore we’ve created two personas - the investors and potential clients/business partner (who would like to know the product details as well as company profile).
Build Sitemap
After deciding all the contents to be displayed, we arranged them in hierarchies to help users find pages they need on the site easily and clearly.
Along the way structuring, one of the tough decisions lied in the website's overall arrangement - the choice between "one single-page" or "multi-pages” layout. Even though the "single-page" is more intuitional and friendly on mobile devices, but I still convinced myself building the sitemap with the latter.
One of the main considerations was the "extensibility", to keep the possibilities of adding new content for a start-up company, which usually grows fast with frequent iterations. Another came from the client's requests on the "exposure" - multi-pages website performs better in SEO (search engine optimization) technically, content on different pages help make information more easily exposed to users and investors/partners when searching online. Similar consideration of GA data for future analysis.
Create Wireframes
We didn't have vast quantities of information given to be displayed but with varieties, thus I chose to keep hierarchies simple and control the number of sub-pages, in order to reduce bounce rate and keep users away from distractions.
By keeping the homepage simple and refined, more details are distributed on sub-pages. Every page was thoughtfully assigned with different duties in delivering information.
Define Visuals
We're expected to preserve the client's branding, but extending its emphasis a towards creating an atmosphere of modern professionalism. The simple design language made the pages readable and scalable but with enough visual flair to avoid making them look simplistic and uninteresting.
* Mentioned earlier above, I was leading the whole UX process in this project, UI design works attributed to my talented co-worker.
Landing page as an example📍
The feeling of calm and trust comes out of the usage of a dark blue color plus geometric square shapes. Meanwhile, the appearance of the bright and energetic orange demonstrate the fresh feeling throughout the page, making it fresh and vibrant. With some delicate details that appear sometimes next to the title, metaphorically unveil the precise nature that could be found in their products.
