Spectrum

Homepage

Below you can choose between page view of desktop or mobile version.

---

Full size images:

Desktop

Mobile

Menu for mobile

The Mobile version of the menu combines a navigation strip, the main menu from the desktop, and a search feature.

Some of the links contain cluster pages (marked with an arrow on the right-hand side).

Clicking on the name of the page will move to the page. When the user clicks on the arrow, he will trigger a change of the menu screen, which will show all cluster pages, parent page (marked with underline), and a back button that navigate the user to the previous menu screen.

---

Full size image:

Mobile menu

Search window

For the desktop version, the search box supposes to come from the top, overlaying content below it.

The mobile version is a part of the menu that replaces the menu screen showing proposed search results and quick links. If the user clicks the cancel button, he will go back to the menu screen.

---

Full size images:

Desktop search default

Desktop search proposed resaults

Mobile search

Markets

This page show markets that contain turbos that the company offers.

They are split into 3 main groups, which allow faster recognition of what we are looking for.

---

Below you can choose between page view of desktop or mobile version.

---

Full size images:

Desktop

Mobile

Buttons and forms

Market

This page shows all turbos available in the selected market.

---

Below you can choose between page view of desktop or mobile version.

---

Full size images:

Desktop

Mobile

MA page

This page contains detailed information on the selected turbo and all necessary documents.

In the Quote/Order section, there are two boxes, "BID" and "ASK" to simulate the movement of the market, I used an animation which shows a red (price go down) or blue (price go up) bar, which will move and change its color depending on the market movement (price go up, change the position of the bar to the top of the box and change color to blue; price go down, change the position of the bar to the bottom of the box and change color to red).

---

Below you can choose between page view of desktop or mobile version.