My role
My work focused on creating the final website with visual design and how to make it intuitive and accessible for users. When I joined the team, the research and concepts were wrapped up in the previous phase. the main content, illustrations and wireframe from other team members were already handed over.
Review the wireframe and transfer it into high fidelity prototypeCreate the visual styles and develop different page layouts Consider the accessibility and usability Collaborate with front-end developer and handover the design
Process
Exploring the visual form Wireframe to High fidelity prototype
The initial wireframe had already done by the developer, I started to work on the visual form Wireframe to High fidelity prototype . My work focuses on how to make this website with good quality visuals. The main task was to create harmony for the structure. It needs to design the visual to reflect on the hierarchy from principle, patterns to examples.
Challenge
My learning
Make the layout simple with multiple types of information & Consider Accessibility
This library includes different types of information. The website’s information architecture was simple, it has many contents on a single page. The illustrations and same visual language were important to guide. The simple layout is intuitive to make an adequate space to read the content.
Trying work align with accessibility for all components, colours, and fonts. (These components can pass the AA standard from WCAG). I worked with the developer to choose more accessible options in the design library and page template.
My learning
Outcome
Develop new visual design which reflects on colour psychology
The neutral colour palette is referring to colour psychology research. The blue and green tone tend to provide calmness and safety for people. The high brightness emphasizes positivity. The palette shows the relationship from Principle (high level) to example (low level).
My learning
The challenging and learning
It was challenging to deliver the design without involving any previous works. The process was fast-paced to dive into the design work. The internal feedback was positive about the outcome. In hindsight, it would be ideal to conduct a few usability testings to review the visual and layout before the developing phase.
