UIX Design Task
Design task for Sideways 6 hiring process.
Company
UIX Design Task
Sideways 6
Year
2021
Task
Create screens for new Campaign flow
Sideways 6 is an idea management platform for companies that use Microsoft Teams, Yammer and Workplace by Facebook.
The overall idea behind this service is great and I got really excited while working on the design task. Thank you Sideways 6 team for reviewing my work and considering me for the position.
01 Research
I started with finding more information about the company - who are the clients and what is a Campaign in the context of the tasks.
The clients are big corporations such as British Airways, IKEA and Walmart, this means organisations with 1,000+ employees working in a fast-paced environment. Having those things in mind, my suggestion would be to create as simple as possible and very intuitive product - there could be very little to no time allocated to train those employees how to use Sideways6 component.
If I had a chance to make more extensive research I would do the following:
-
Start with requesting more information internally from the Product and Design teams, so I can understand all of the specifics of the product, at what stage are we - initial creation or updating an already created product;
-
Should we customise the product specifically for a client or should we create a product suitable for all customers? Based on that I would have different approach;
-
After that I would have scheduled an interview with the Product Manager mentioned in the task description to understand better all requirements;
-
If we need to rework an already created product, I would conduct surveys with some of the users to understand what they already like and what they dislike;
02 User Flow
The user flow for creating a new Campaign is separated into four steps:
-
Add name and description of the Campaign
-
Add duration and stages
-
Add integrations, tags and groups connected to the selected integrations
-
Assign owners and moderators of the Campaign.
03 Sketches
1st sketch
2nd sketch
04 Decision & Wireframes
Went down the route of creating wireframes for the first sketch, because the main flow would be to drag and drop ideas/campaigns between the stages. This would make the product more intuitive and using gamification elements is always more engaging, plus enhancing simplification. To drag and drop campaigns/ideas from left to right, and vice versa, will be easier than dragging and dropping them from top to bottom. We can add more stages and still perform the task without much scrolling.
05 User Interface
For the UI screens were used the provided design guidelines.
A simple login page to start the process.
Under "Campaigns" we can browse all current campaigns, but also add/edit and remove them if needed. We can drag and drop campaigns to change their stage or we can click "Options" to select manually to which stage to transfer the campaign.
If we open a campaign, we can view all details regarding this campaign and we can edit it.
Under "Options" CTA in the upper right corner of each integration, we can extract ideas based on Groups or Tags.
We can add/edit/remove stages depending user's needs.
UI cards, for the ideas downloaded from your website, are used to keep the consistency with the already created designs.
.png)
06 Motion Preview
You can preview some simple animations from the New Campaign creation process.
07 Testing
For the testing phase it depends again whether the product we create would be custom made or for all Sideways 6 customers.
-
In case it is custom made - we could go with direct testing within the main user-base of the platform and ask them to perform simple tasks and monitor whether they can easily complete them. We can interview both groups of users - those familiar with the platform and those, who don't have much experience using it, but expecting to start using it in the near future.
-
In case of the wider Sideways 6 customer base, we could go with session recording. Again, we can ask them a number of questions about their overall experience in the beginning and afterwards continue with performing tasks connected to the components we are testing.
