Trading Skills – MUXL Academy project


The brief

Discuss real problems that can be solved with tech in 8 weeks, with users you can contact for research purposes.

Here we discussed a variety of ideas first looking at dating apps, which then quickly turned into a way of connecting people. The main idea was a trading skills app where baking a cake can be exchanged for child minding within the local community to helping with DIY around the house.

To first validate our idea we quickly gave a quick profile of what we thought our users could be. This was first time buyers and mums.  


User interview

From the user interviews we quickly found that the amount of trust needed with mums to baby sit or to do the school run was far too much to focus on so we decided to focus on first time buyers and DIY tasks.

This came with its on problems though as to create trust in the neighbourhood and try to make sure that neighbourly relationships were not broken with our product.

Principles checklist from user interviews:

  • Build respect between community. (Any problems can create awkward situation with neighbours).
  • Allow users to focus on immediate friends first that already have a rapport.
  • Try to move away from publicising roles that occur weekly.
  • Find a way that makes people want to join in and help, rather than just receiving work.



From the research gathered we created our personas

First time buyer

Young couple Age: Late 20’3 early 30’s

Occupation: Buyer, Works full time, 8.30 – 6.00Just moved into first home.

Still enjoys nights out with friends. Finds there’s not much time time in the week.

Tech savvy, has all latest technology, but not keen on DIY although does help friends if needed


Age: 36

3 Kids: 3, 5, 7

Occupation: Product Owner,Works Part time

Works: Monday, Tuesday, Wednesday, Thursday. 9-4

Can work from home, Finds despite not working Fridays a full weeks work is still required to fulfil job role. Will often not leave on time to help team with project queries.


First we explored the initial idea of creating journey maps, mind maps, random links, and creative stimulus where we considered other environments related to our users.


NABC (Needs Approach Benefits Competition)

Who/ What, How much, When, How, Where?

Taking the ideas we have generated we started to narrow down the ideas and chose our strongest ideas and created the following sketches to further explore our ideas.


Idea selection

Here we took our ideas and scored them to finally decide where to focus.

Validating our idea with a quick experiment

Just to see the uptake with friends I carried out a quick experiment. To test the uptake of the our concept I posted a question on Whatsapp to friends asking for help me with a DIY task.

Question posted:

Q: Does anyone want to do some manual labour for little to no pay.

Group size: 16

Responded Yes: 6

Refusals: 1

37.5% uptake in idea

Comments received:

  • Someone asked if people would be up for child minding instead
  • One person asked what points system would they be rewarded with
  • Another asking if there would be beer

Day of work:

  • 5 people turned up with 2 of them turning up half way through the job

Our idea:

Creating a community for personalised needs. Allowing users to reach out to the local community for help with their tasks in exchange for their time.

Here our users can request help for a job and will pay in time. To gain more time the users will have to help other people in the community.


Information Architecture

Journey maps

Here we used our personas and research that we had gathered to run through each task our users would go through when doing a DIY task.


User Flows

Using the journey maps I started to look at the general process the user would go through when using the Trading skills application.


Site map




Paper prototypes

Here we wanted to quickly test how to best present user profiles to other users within the app.

We learnt here that it’s best to trim down the information and to focus on reviews and star ratings.


Using We started to move the sketches to wireframes and into a direct Prototype that could be tested. First looking at the initial Prototype by using it myself and putting together a User journey to show how the users would flow through the app, making notes and alterations from the thoughts of the rest of the class.


User tests

Deciding the research goals

Looking at the current prototype I came up with a list of areas that I wanted to explorer.

  • Do we need a navigation.
  • Does the user understand the process of receiving time for carrying out tasks.
  • Can users easily add tasks and enter information.
  • Can users easily find where to look through tasks and apply for them.
  • Do users understand what is happening on the homepage. (As this is the main control panel that keeps user informed of upcoming jobs, and whether they need to carry out anything.


Setting the scene for the User testing

  • You have been doing some DIY and need to get some help to get the job finished. Sign up to Trading Skills using a facebook and get to the homepage homepage.
  • You are about to starting stripping the wallpaper but would like some help this weekend. Please use the app to add a task and then return to the homepage.
  • How would you go about getting some more time that you could use to create more of your own tasks.


User interviews

[Photo of the notes taken]


Completed Prototype and User flow

Below showing the latest iteration of the Trading Skills app. Using the notes taken from user testing:

  • Putting task that users needs to carry out in a more prominent position on the homepage.
  • More messaging to allow users to know when they have carried out a task.
  • Maps so users know where the task is taking place at a quick glance.
  • Slight copy amends.
  • Allowing users to filter when searching job.




Further development


There are further amends or enhancements that need to be explored.


These include:

  • Investigating equipment and users lending equipment to each other.
  • Further investigation into linking Friends to help jobs, Wether this is linking the right people to you. Or grouping friends and you can select a group of friends to help with a task, so there is less awkwardness in everyone getting to know each other.
  • Trading knowledge section, maybe people don’t need help with tasks and a quick chat would help.
  • Further investigation on keeping people safe when using this app. Using a photo recognition software that sometimes are used in dating apps to confirm the right person, and to make sure all addresses are correct.
  • If there is no one to help, look to see if you can include local trader advertisement.


Sainsbury’s components

A project looking at what new components and functionality we can add within the Magnolia CMS.

Competitor analysis

Looking into how our competitors serve up content containers to their customers.



Taking the personas and turning their needs into question to be answered

and then using these to create “How might we” questions

  • How might we allow our customers to find out more on our products, with interrupting their shopping mission.
  • How might we introduce new products to customers that relate to their previous shops.
  • How might we let customers know of upcoming offers.



Starting to sketch out ideas



Hired by a small agency (The Workers) to help wireframe a new website for a production studio (Nexus Studios) who produce and direct films for clients such as Audi, UEFA, and Google.

Within the brief the clients wanted a more streamlined approach the pages that were currently on the site with focus on the studio and the directors showing that they possess the skills in house.

The agency we worked with also wanted to create an editorial feel to the site where users would be able to explore the work they produce.


User- Marketing Manager

  • Responsibilities
    • Planning implementation of marketing material
    • Establishing strategies to meet goals
    • Project management
    • Staying current with industry
  • Challenges
    • Understaffed
    • Unrealistic deadlines
  • Wanting to see broad range of work, and clients to gain confidence in the company. May need to forward work onto people within team to gain support to start talking with particular agencies.
  • Doesn’t want to waste time getting lost or have to work out how to use aspects within the website.
  • Wants to see good quality work that excites them that gives them ideas for their own company marketing plans.
  • Saturation of talent within the industry – How do they find the right fit?


User- Directors

  • Established directors
    • Looking for the next role that brings good clients for CV, along with excitement of being able to push boundaries in their work.
    • Wants to see a company where they feel they can have likeminded people to work with and be excited by


  • Graduate producers directors
    • Straight out of uni, or moving into second role.
    • Wants to see if it’s possible to learn off peers,
    • Looking to the future – seeing if there is progression with the company


Deconstruct existing website

First we took apart the existing website, looking at areas that should be improves

What we found:

  • News section within homepage didn’t have headers allowing the user to know the context of the content block. Eg whether it was news, social or work.
  • Not enough space between content, not allowing the work they produce to breathe.
  • When viewing the directors and work pages it was quite easy to get lost within the different sections as the work took you to different areas of the site
  • Inconsistencies across site with video player and format
  • Could be doing more with social being pulled into site to help keep content fresh within site.
  • Nowhere to allow users to share content



Initial wireframes

Below showing initial concepts and building into wireframes

Client feedback

Here we sat down with The Workers to discuss our initial ideas. From this we were given a number of points to focus on when reiterating our original concept.

Initial thoughts from meeting:

  • We were given more freedom to adapt the site map where we felt the site content could be reduced to ease user journey.
  • Top open up the initial filters to allow user to explore the site more.
  • See if there is a better way to serve the contact information to the user other than the footer.


Final wireframes

From the initial wireframes we made a few modifications to the site

  • Combing Work and director page that then both lead the users to the project page.
  • The Individual client page moves becomes a filter within work and Talent. The Videos then reshuffle with text above giving a short description to the director. Helping to not navigate the user away from this initial browsing/filter page.
  • Moving the skills out of studio page and into the Work and Talent as filters. This allows the user to browse the work depending on filter, as well as giving a short description of the skill at the top of page to help give more insight into the Nexus Studio.
  • The use of larger text in short sentences as a page break and help give more insight into the nexus studio as well as introducing new the users to a new section within the page.















Supplier site

A project at work where I was asked to build a go to website that would help answer the questions that our supplier have, when booking content onto the Sainsbury’s website.

Atomic design

When first joining Sainsbury’s, I found that the team were using templates for their page builds.

After talking with a number of the producer team I found that they want more control within their pages. As the team did not have HTML skills it caused a lot of pages to break as they tried to change their pages.

Here I instigated the move for our designs to be component based. Allowing our producer team to changed the content of the page and quickly and easily create their own templates without the need to brief a new template and duplicate content.

First building the atoms that allowed the producer to choose the text format they wanted to use within their content.

Then producing multiple templates the producer can use within their pages and drop content into.




Within a buying role at Sainsbury’s, Tesco, Argos and you are starting to prepare for a new season, or looking at a new range there is first a lot of research that needs to be carried out. One of the tasks is to perform a Comp Shop, to see what competitors are selling within their range and what they are placing their focus on.

The CompShop app aims to give users a place where the information gathered can be saved as well as presenting this information for the various strategy meetings that take place.

The current problem

– Everyone within the team takes their notes on different formats. eg pen and paper, mobile notes. Making it quite time consuming to collate this data when back at the office.
– When out on the comp shop a lot of photos are taken of products, Shelving, and different competitor offers but there is no system
that links the notes taken from colleagues with the various images taken, so this becomes a manual task to link up the images with the notes when back at the office.
– The start of a new season can be quite a busy time. Collecting the teams data can happen a number of weeks after the comp shop has taken place, meaning that when collating, certain points may be missed.
– Because different people collate the Comp Shop every season, it can be very difficult to find previous Comp Shops to compare against.
-All the current teams display their data in different ways. Causing issues when senior manager move departments with teams delivering something the manager is not used to or expecting.

The User

Tesco employees within Buying team. Including Buyer, Merchandising, Technical and Web Trading.


– Mobile app that will collate the teams data, notes and images.
– Will link photos taken with the correct store.
– Will present the teams data in a web interface, that can be saved out and be used within a team strategy meeting.
– A system that allows users to view past CompShops.


Research – Concur

Concur is a mobile application that allows employees to submit expenses. I can see this being a similar application as the CompShop as this is a simple interface that presents the user with a number of forms they have to enter, as well as using the camera to add receipts to specific expenses.


  • Simple to use. You can generally pick this up and use it with little knowledge of the app.
  • Clearly spaced and labeled.


  • When entering and submitting a form you go through different pages and it is not clear how far you have gone away from the home page of your initial entry. I think this can be partly blamed on the page colour. As all are white its difficult to create a picture in your head of how you have directed yourself to the current page.

Research – Bazaar voice

Bazaar voice is an online application that gathers our customer comments and ratings. It will then feed this data back so you can quickly decide what products need to be focused on, and how these have been tracking over a certain period of time.


  • Very good at gaining a brief overview of how your area is tracking and what areas need to be looked at in more detail.
  • Data can be easily adapted and can be presented in meetings without having to edit and change formats.
  • Doesn’t give too many options so overbearing for first time users.
  • Question marks discreetly added to help users understand what is being seen.
  • When hovering over graphs more detail is quickly presented in a small pop up, making the forms engaging.


  • Does not take into account actual returns so you can not rely on this data alone.
  • Only shows data in graph format. Table format may be beneficial to digging down deeper.

Research – Dunnhumby

Dunnhumby is a company that uses clubcard transactions to help Tesco and out more about their customers.
They deal with lots of data and have to present this in a way that can be easily understood.


  • Have separated the page into two defined areas. Top data, bottom form, allowing user to clearly move between different sources.
  • Colour coded so user can determine the relation between top data table and bottom form.


  • No feedback from forms, showing data.
  • No quick tips explaining to new users how to interpret the data.
  • Above form you have drop down to change data source. As a new user there are too many options, which can be quite overwhelming.

User Journey. Mobile application

Showing user flow of how both a participant and organiser would use the comp shop app.

User Journey. Desktop

Showing user ow of how both a participant and organiser can edit submitted data as well as accessing data in graph form.

Sitemap. Mobile and Website

Wireframe. Mobile


Wireframe. Desktop