competitive analysis, task flow, style tiles,
style guide & high fidelity mock ups
The IO Portal is an insertion order platform for both internal users and external. Orders include different type of programmatic media including static, dynamic or video ads. This platform was created to simplify the ordering process between the clients and account managers that recieved them.
The challenge for this project was to use the relevant content from the existing platform and to streamline the process of placing an insertion order. The process needed to include previous options along with the new products the company wanted to introduce to their clients. The goal was to get the necessary information to the account team while making the process of filling out and uploading comprehensible to the client.
After going through our competitive analisys and research insights we establish our design principles. We wanted to focus on a clear sense of hierarchy levels, maintain an approachable and informative platform and simple insertion order entry process.
This task flow focuses on the client facing portal starting from the log in screen. It shows the decision point to either select a market to view campaigns or to create a new campaign. It also shows the path to editing a campaign.
The style tiles show the exploration of different design approaches. The colors were chosen based off of the company brand colors. Each design communicates a different style including a fresh and clean direction, a light & inviting direction and a bold direction. After recieveing stakeholder and user feedback the light and inviting design approach was choosen. This color palette and iconography style was used to complete other platform elements.
After finalizing the high fidelity mock ups, a style guide was created for other designers and the development team to reference. The style guide includes the primary and secondary color palettes, fonts, button styles & callout treatment. Further spacing, sizing and specs were added here for consistency.
Below are some examples of the high fidelity mock ups I created based off of the prototype. This starts with the log in screen and the process is continued to the market selection page, the campaign list and the flight detail page.