Consultus is a fully responsive, commercial WordPress theme that I designed and built. It is a multi-purpose theme, however, the demo content was targeted at agencies/consulting businesses.
Project overview
Challenges
- Ensuring that design works on screens of all sizes
- Implementing relevant demo content
- Showcasing theme features
Solutions
- Design elements (e.g. menu) that adapt to screen sizes
- Stock images and copy based around a fictional consulting agency
- Several pages that showcase various layouts and features
Results
- High fidelity designs for mobile and desktop screens
- Functional WordPress theme
- Revenue from selling this theme online
Research
I started the design process by researching similar websites and looking for common trends in terms of content, structure and layout. Next, I researched who the potential users might be and what they would look for. For example, users that are looking to work with marketing or creative agencies find trust elements very important (testimonials, personal info etc.). Based on the research I chose blue as the main accent colour because it is a calm, corporate colour and it is also associated with intelligence and stability. I used a serif font for headlines to create a more distinct brand identity and to convey quality and class.
Low fidelity designs
Wireframing
In this stage I created wireframes for all the key pages and made sure they contained essential elements highlighted in the research phase. Below you can see the homepage wireframe.
High fidelity designs
Homepage
The finished homepage design features a distinct brand style, sections for agency services as well as trust building elements e.g. testimonials.
About page
The about page contains member profiles and important information about the company in an easy-to-read layout.
Product page and shop
This wordpress theme also has e-commerce functionality so I added designs for shop and product pages that are in-line with the brand identity.
Contact page
The main component on this page is the contact form. I also included a map and contact details.
Blog page
I used cards for blog posts with a featured blog post at the top.
Blog post
The blog post has a single column, somewhat narrow layout to make it easy for users to read long format blog posts.
