Looking through the product requirements, the pages for the admin platform were outlined
and a timeline was set for deliverables. The timeline was sufficient to churn out the design for the interfaces but
was quite short for converting them to code so I had to explore ways to quickly convert designs into code.
The timeline for the project was pretty short and I had to do both the task of designing and coding the interfaces
so I had to for go research in my design process.
1. Design wireframes
2. Test wireframes
3. Convert wireframes to High fidelity
4. Convert designs to code
Based on the features outlined I designed low-fidelity screens, this allowed me to quickly define the layout of the screens
without bothering about colours or icons.
After testing the low fidelity screens with some users and stakeholders, I moved on to converting them to
high-fidelity mockups. Since I had to convert the designs to code in a short time frame,
I grabbed the
as a template for the Design to HTML/CSS conversion.
I chose a dark colour for the side bar and a blue colour to highlight active links.
For the initial user interface design, I chose Apercu Pro For typography but ended
up using a free google font -
Sans, a Sans-Serif typeface in the final HTML/CSS code.
Aa Bb Cc
This was a challenging project because of the short timeline to deliver designs and code
but it was great
pushing the final code. 😁