Our goal with this design was to create a user interface that looks high end and professional while keeping a contemporary look, but also easy to navigate and explore. Instead of using dull bulleted lists and blobs of text to communicate Virtual Brokers's message, our designer has created a dynamic layout that usings negative space effectively while also providing concise resources for their clients.
For this mock up we opted for a sleek and classic colour scheme of red, white and black. However, colour is very flexible and Geek Power would be happy to try some other colour schemes too. Colour can very drastically change the mood of a design, so we advise to consider it.
We have selected a grounded and simple sans-serif typeface for all the type on the design for a clean lightweight look. This font is web safe and will render correctly across all browsers and platforms.
A responsive design allows Virtual Brokers's interface to be more accessible to their visitors. The design stretches and forms itself to every screen size, so that every user gets the best possible experience.
The Desktop version of the design is optimized for viewing on a laptop or a monitor. Every element of the design will become larger and more spread out or smaller and closer together depending on the specific size of the screen.
jQuery is the perfect way to communicate the services available to Virtual Brokers's clientele, while adding subtle movement to the design.
The top of the website is optimized for ease of usability. This is where the main navigation, including the drop down menu functionality, is located to create a navigational hub for the whole site. A special feature with the particular navigation bar is that it stays fixed to the top of the page at all times which reduces scrolls on the page.
The key elements of the website are the actionable items. Featured throughout the homepage, these areas direct the user to the key selling points of the business pushing traffic through the website and keeping users on track with the most pertinent information. The homepage is dedicated to this purpose.
In the footer is a secondary navigation to further improve the usability of the website.
The tablet version of the design is similar to the desktop version, except that all the graphics get condensed to fit much better at the smaller resolution.
For mobile devices, all the content moves in to a one column layout so that all the images and text can remain large enough to be seen on a much smaller screen. Also many functionalities have been simplified for a touch interface, such as the main navigation.