Paper Craft

An e-commerce redesign

PROJECT 2 CASE STUDY

Well well well, look who made it to the end of another project!

This was the second project I completed when undergoing the UX Design Immersive course with GA and it really felt like quite the step up from project one. The challenge was to assist the redesign of a website from one of the four companies we were offered. I chose to go with the company ‘Paper Craft’, a stationary shop based in Hammersmith. Personally, being quite the stationary fanatic myself, I thought that it might make me all the more familiar with the inventory we would be given down the line (I hoped that it might make categorising slightly easier!

As the image above states, Paper Craft’s issue was that they had been receiving high levels of internet traffic but with few customers actually completing their purchases. As well as trying solve their issue of their customers not completing their orders, the retailers also insisted that their ‘small shop’ appeal and customer service were heavily engrained within the site’s feel and function.

INTERVIEWS AND AFFINITY MAPPING

SO, the first stage of my process was basic level research of the company and location to try and gauge how I wanted to develop my interview style. Personally, I really enjoy the interviewing process and take great pleasure out of trying to engage with customers as to what it is they are really looking for! My interview process resulted in five different interviews being conducted over Zoom. All the users were super cooperative and I tried to encourage them as much as possible to be open and honest about possibly niche elements of their buying habits. A big element of the interview process consisted of asking the users about their preferences between online and local shopping as this was something the retailer had specifically expressed they wanted to hone in on. In asking this I was trying to understand what the exact elements of locality that the customers enjoyed and how this might be implemented online.

After conducting the interviews, I then went about affinity mapping (essentially a large brainstorm) of all the answers and opinions I had been given by my interviewees. Despite this stage of research being one of my favourites, I actually significantly struggled with finding new groups aside from pooling all answers from one question into one category throughout. This process actually made me recognise the further issues I had made for myself within the questions that I had been giving to my users. This was as a result of finding answers about things like stationary preference or writing medium — which at this stage of research definitely doesn’t contribute to grouping what issues the users are having purchasing! Having said this though, it definitely assisted building up an increased rapport with several interviewees when we got discussing the best ink pens around (Lamy is undoubtedly top of my list!). Affinity mapping my responses also got me to realise my error in the way I had been recording my users’ answers. As you will see in the images below, the post it notes detail my users’ WHOLE response which made it increasingly difficult to pick out trends when grouping. I therefore had to select themes and trends I had noticed — hence the purple bubbles seen. The result of my mapping highlighted that stationary shopping brought up very nostalgic memories for my users from school, this was also strongly embedded in the time in which they would buy their stationary — following the educational calendar in September and the New Year. Upon discovering this, I really wanted to try and embody this organised sensation when designing further along the line.

PERSONA

Once I had a better understanding of what my users opinion was and who they were, I went on to build a persona. A representation of who I thought the average consumer was, assisting me to build a better product in which to fix their issues.

The persona I came up with was Marlin, the artist. Marlin is an active, passionate individual who spends a vast majority of his time creating and any free time being sociable or going to events. The scenario that I came up with was based around the idea that Marlin has such a busy schedule, he hardly has time to think about being able to buy artist supplies and never knows if he will be there during opening hours. I also wanted to add in that Marlin was passionate about the environment as was another recurring theme that came up for my users and they wanted to see implemented in some way.

COMPETITIVE AND COMPARATIVE ANALYSIS

In this initial stage of research I wanted to have a look at three similar companies and their websites to understand what necessary functions appeared in all and what steps their users take to complete basic actions like selecting an item and purchasing it. I tried to find three companies that were all slightly different in size and financial pricing. I therefore ended up comparing Rymans, MUJI and The London Graphic Centre. I found all three had similar feature inventory albeit if displayed slightly differently. When performing task analysis I found that all three took 9 steps in which to find a specific item, add it to their basket and checkout. Although this seemed to be the same across the board, I comparatively checked this with Amazon’s checkout process which allows you to use the ‘one click, one buy’ function in which you can complete the same task in 5 steps. I figured that this was something to remember developing down the line — although perhaps not necessarily to be implemented as my users all seem to state feeling Amazon’s values contradicted those of local shopping. The below image is a compiled of my analysis that I completed and the necessary features I deemed necessary.

USER JOURNEY, HOW MIGHT WE AND PROBLEM STATEMENT.

After compiling the analysis above I then went on to recreate my users’ journey. The diagram in which I envisaged this journey taking place is found below. Although, it doesn’t seem to have any overwhelming negative aspects, it helped me to think about how I was going to continually try and improve this for my users as I went on to design.

After designing the user journey, I was able to then think about all the potential ‘how might we’ statements that could be developed off the back of it. How might we statements are used to help try and think about all the alternative pathways that could be taken toward building a solution for the user. Although I personally found them difficult to come up with when first introduced to the concept, I find them incredibly helpful in narrowing a passageway and developing a problem statement in which to answer.

As previously mentioned, I was particularly enamoured with the idea of how I could make my users experience as nostalgic as possible after the theme reoccurred in interviews. I therefore decided on defining my problem statement as Marlin needs to be able to easily purchase necessary stationary whilst creating a nostalgic feel to the process so that he has more free time to create.

CRAZY 8’s

Crazy 8’s really are my favourite part of the whole initial research process. Probably something to do with the name (us being kindred spirits and all) but mostly because I think that they are satisfying and highly effective. The concept is about giving yourself 30 seconds to conceptualise an idea — no matter how fictional — and repeating the process eight times until you come up with something like the image above. The boxes that I have circled are, as previously mentioned, themes that I had heard my users discussing and ones I wanted to build on. These consisted of environmental ideas such as pledges and schemes to how we play on making the site emulate a school nostalgia.

CARD SORTING

Card sorting was a new process to me this time around, and one that is particularly lengthy and can be complicated when organising the results. Card sorting is used to help define categories into which inventory can be put under so that it can be easily found by the customer. What makes sense to you in terms of navigation, doesn’t necessarily mean that it will make sense to another when trying to find an item hidden with an entire browser full of goods. I had eight users complete an open card sort of inventory, whereby they were allowed to organise and define the goods into categories and name those groups.

On a whole, the majority of the card sorting results produced very similar groups and categories. This was a very satisfying outcome as it meant that any outliers could be categorised into where the majority had put it. It was at this stage of research, it was also becoming more apparent to me that part of the joy of stationary shopping for users is about going and being able to see all the products when they might not necessarily know what they went in to buy originally. I thought this was an important element to consider at this stage as it would affect the users overall purchasing experience.

SITE MAP, USER FLOW AND PAPER PROTOTYPES

After card sorting created defined the categories I was going to run with, it was time to sketching! In order to plan what the site was going to look like I need to have a map of the site aka a site map…clever, I know. This would allow me to understand the steps my user was going to take to navigate through the site to their end goal. After drawing this out, I was able to then envisage the user flow — specifically the ‘happy path’ — in which we only look at the users making the ‘right’ decisions to get the end. These steps then allowed me to get onto the paper prototypes. Paper prototypes allow me to test out how users would naturally navigate through the site before I digitalise it in a way that may not work for them.

After testing out my prototypes above, I was able to get going on digitalising them in Figma to low fidelity before testing them again.

LOW FIDELITY WIRE FRAMES AND USABILITY TESTING

The idea of low fidelity wire framing is for both my users to see the site coming in life digitally, but also for me as a designer to see how the they will interact with the product despite it hugely reduced quality. The testing I asked my users to complete was done so that I could ensure that they were able to navigate from the beginning of the test to the end without running into any issues. After receiving their feedback I can then iterate on where they might see problems, whether that be in navigation or overall layout of the site.

I made the mistake of asking my brutally honest family and friends what they made of the product and have highlighted where they sought issues with the frames. The majority of the issues were actually surrounding navigation that would be changed when not prototyping in Figma but were important to take on none the less to ensure they were not implemented elsewhere! Aesthetically, the orientation of the stars (I didn’t know it was possible for them to be a right way up, but apparently there is!) and white space circled in pink in the left hand image.

Excitingly, this project is to be continued and iterated on in higher fidelity quality that I unfortunately haven’t got around to just yet! In summary however, I have found this two week sprint an absolute mixed bag of emotion, it has been highly satisfying to create a tangible product but the research that goes into it even before it you turn digital is mammoth! None the less, I was highly entertained by coming up with ideas and concepts for this project and it has made me all the more excited to continue onwards with UX as it gets ever more complicated and complex!