Portfolio: Luke Dowding – UX/UI Designer

Challenges & Problems

When we started this project it was right in the middle of the pandemic so it was hard to get out to gyms and see what people were doing with their gym apps. I had to rely heavily on competitor research and my own testing and usage of similar apps as well as talking to family and friends who use the gym. Finding the problems that exist with current gym apps, in terms of usability and features that we thought people would love was a big challenge. The context of when people use this app was also a big consideration, a gym app needs to be quick, unintrusive, something I can use when I'm breathing heavily in between a set of concentration curls. Other issues we have had to solve are how people use the gym and making a platform people can work out exactly how they want. As well as what they call certain exercises, some people use KGs some use LBS, some gyms outside of big western gyms might even have mixed units of weights and we have to be ready for it.

My Role & Solutions

Designing every aspect of the Wotive experience from the Advertisement, Landing page, and Onboarding down to entering your reps and sets when sweating over a set of dumbells. I had to really focus on the user and their context, an experience that adds value to the workout, not a hindrance. I really focused on making an experience that lets you workout however you want, the app has lots of ways you can workout. Other apps really force you down paths that some days you aren't going to want to do. Wotive really lets you work out however you want, we see that most people already know what they want to do in the gym and we support that fully. While also allowing new people to use pre-made workouts so they can learn. Even allowing people to create supersets and at any point in the app effortlessly drop your set if it's getting too hard. It's a no-bullshit app, work out how you want, share it with your friends, and track everything to see your actual progress.

Reflection

As an ongoing project and start of a small business, we really pushed for a compelling version of the app rather than kicking something kinda useless out the door on release. While we have a ton of work ahead and lots of plans, the released version was a basic app with our solutions to gym app problems that we got to test and iron out really well. At this current stage, we are adding onto that core functionality and adding amazing features which really prop up that core work we did to make a compelling product at the start.

Check out the Wotive website to learn more or download the app.

Challenges & Problems

One of the most interesting and fun projects I have ever worked on and in 3 main parts, the website, the app, and the overlays themselves. The most challenging part is the overlays which are basically designing an interface for a racing simulator (game). Almost like designing the dashboard of real cars, it's about giving vital information easily and fast. We have a lot of complex overlays that need to be made easy to read in the blink of an eye, so one of the common challenges is actually pulling back on the information design a little and keeping the users and the context of the overlays in the forefront of our mind.

My Role & Solutions

The project was initially started by Istvan who had the idea and 3-5 basic overlays, I would watch him stream iRacing on twitch and use the overlays, it had a small following a few years ago but had massive potential. I offered to help him make the app a better user experience and visually aid his efforts allowing him to focus on the actual development. Since then I have designed everything from the Landing page to the App that allows a ton of control and customization over your overlays. As well as a layout builder, car setup sharing, series stats, driver stats, and over 25 different overlays all very unique in their function but maintaining our look and focus on the right level of information vs design.

Reflection

Racelabs has become the biggest and most used overlays in iRacing, not only for streamers but for every day by regular sim racers too. The project, in general, has been a great success and we have a ton more in the pipeline.

Check out the Racelab website or see it in action in this youtube video.

Challenges & Problems

This project was a long-time idea that with the help of a friend we thought we could have a crack at. Having known nothing about making a game we went for as simple a solution as possible, using Unity and building a 2d platform game. This project took a ton of time to figure out, lots of testing, failing, and learning with limited knowledge and skill we could make something work.

My Role & Solutions

I designed and planned out the entire game, from UI to game design, look and feel. I sketched wireframes for the user flow and UI design, had many iterations of the main character, as well as designed all the scenery and level design.

Reflection

Some of the ways I had to design and implement levels and background were extremely limited. I think if I tried something like this again, I would try to find tools that better suit the job at hand. While I was able to use tools I was very proficient in, it was quite a challenge to take that and get it working into the game the way we wanted easily.

Challenges & Problems

This product was designed to solve a problem that existed on gift idea websites and Amazon. It tries to merge the two with a solution that is easy and helpful for the users. The problem being that, most gift websites show gift idea that is not very good and sharing your gift lift with others is not very user-friendly. If you want a gift for a specific type of person it would be good to see what people just like you're you person liked for gifts. Other websites that have gifting lists do not have a very good way of sharing your list with family or friends, because of gift item limits of site limits. We wanted to build an app and website that could suggest the perfect gift as well as make it easy to share your list with family and friends. Also building a users interests and gift list requires a lot of information which could put off users, so finding a simple solution would be very important to onboarding. 

My Role & Solutions

The App/Website would use user data and learn from what people wanted for gifts to then suggest them back to the users that match. So if your Brother is 25, loves golf, we can see what other males, in that age group and similar interests liked for gifts and shoot them right back. This method means we are using actual user data to suggest gifts we know users want and there are several ways we get this information. Firstly we needed to get peoples information, interests and then get them to create a wish list. This wish list would generate gift lists for us with corresponding user types. The second way we collect gift ideas is via the community, by building in a system that lets people suggest gifts for specific people. This would include a rating system so community members can become known for their great gift ideas. The way we take gift idea was also important and part of our MVP was to allow links for all e-commerce stores, so no matter where you love to shop or where your wanted gift is it will work on our site with a simple link.  I came up with a simple way for users to build their interests, because users may have a lot this needs to be as quick and simple as possible. Using material design toggle chips we would filter users interests on onboarding, so at first, you see some high-level categories, the next page you'll see sub-categories for those first needs. This in practice is extremely simple to understand, gets users invested easily and making onboarding very painless.

Reflection

Finding easy solutions for users is really important. If I can create a flow that is easier to understand and quicker to use by spending more time with users and working on the problem then the end product is 10x better. This app and its onboarding process gather a lot of data in a very painless way, no one likes to signup. If you can get your users interesting, invested, they are more likely to finish your signup.

Challenges & Problems

Some of the biggest challenges with this design where limitation to the product or specific ideas which I do not feel where good for the user being used. But as with most things we do the best with what we have, that's part of UX Design. So the challenge for me here was designing a flow that made sense to the user while having the requirement to go to the home page and use a popup to get the user back into the flow. The flow starts like this, Welcome page, Create account page, Homepage. The homepage was the hub for selecting media and discovering new entertainment. The user would default to a trial of samples, so 30-second clips of music for example unless they chose a media type and entered a Credit-Card. Once the user hits that home page they get a popup, which welcomed the user and asked them to select a membership to get the full 30 days free trial. You had the option to say "Not Now" or Continue to the Membership selection page. The membership page was a challenge because it had so many options in such a small space and needed to be as easy to understand as possible. The Membership selection page had to offer the Full Membership for All Media types as well as, Music, Games, Movies, Books, Audiobooks and the Family plan which had 4 different levels. The next page was the Credit- Card followed by a Receipt page before leading back to the Homepage where you could start enjoying the full content.

My Role & Solutions

My role was to design each step of this onboarding signup flow, with that Homepage popup requirement. My main focus for this flow was simplicity and consistency. The Create account page has two groups of options, the social media buttons and the email registration below. It is subtle but the grouping is easy enough to know it is not part of the same thing, it was also important to show loading icons or grey-out the continue button if the process was loading. If you look a the flow you can see the green confirm button is always in the same place, so is the title and other elements. This is important to keep the users focused on the content that is changing and keeps them moving forward. The Membership table went through about 4 different design ideas and variations before we settled on the 2 options drop-down within the design. This made it clear we have lots of options to suit your needs but also that they were grouped for clarity and so you can see it all on one screen. Credit-Card also had some neat validation where if you start to type in your Credit-Card we would show the logo icon of the type of card, this served as nice confirmation things where going well. We also incorporated green lock icon, which we tested and it proved to increase conversions based on the feeling it was secure and safe. The receipt page was the final page before we let them loose, so it was a good place to welcome them again, as well as let them know some of our features, content and remind them of the good deal they just got.

Reflection

There was a lot of limitations and requirements for this design process, as well as the difference in design for iOS and Android was a learning curve but I learned a lot. Making users feel confident in their decision to buy and safe will always increase the conversion rate. The overall conversion rate on the new flow was more than double that of the old flow, so the design was a huge sucess.

Challenges & Problems

Before the redesign of the welcome screen, the first thing you would see when you downloaded the app was login/signup buttons with a singular image background of a girl wearing headphones enjoying some music. It didn't look that bad but it never served a purpose and never answered any questions users would have. We saw from statistics that people would land on this screen, not understand what the app is or what they were signing up for and leave. The app was an entertainment app for people who enjoy music, movies, audiobooks, books and games. Our users were people who were new to the idea of subscription and streaming services or current users of apps like Netflix, Audible, Scribd and Spotify. People downloading the app could be coming from the app store search, a blog post, Facebook or Google Ad, word of mouth, radio ad and many more avenues. To reduce the drop rate on this screen I had to design something to communicate our service to a wide possibility of user brand awareness to our product and convince them that signing up and trying the app was a good idea. One of the biggest challenges for our product over the years was selling all these media types in one package, compared to Netflix who just do movies or Spotify who only have music.

My Role & Solutions

Firstly I conducted research to see what our competitors are doing and how we can improve upon what they have. The main things we want our users to do is to understand what our product is, then they can signup or if they are existing users log in. One of the key design decisions made was to let them know that we had a free trial for the first month, instead of writing this into the main copy we went in a different direction. The signup button would double up as a powerful CTA with: "Start Your Free Month", which gave us room to inform the users about our service more with the main screen copy. We had tested this and other copy variations hundreds of times via landing pages and other signup flows and this always came out on top. Because we wanted to keep the text down to a minimum we opted for slides with a progression indicator, the sliders were optional but clearly there for those who needed more information. Each slide would represent a part of our product which was a unique offering in the market.

Reflection

The result of this new design resulted in a big increase in people moving onto the registration form and ultimately taking the free trial. This product has always been a challenge to sell because it's an all-in-one product but giving the users who are unaware of the brand the slider with more details really helped their confidence. Using your CTA as a powerful sales convincer is a good strategy and it goes to show that copy should be a part of UX Design as early as it can be for a successful design.

Challenges & Problems

The game Guild Wars 2 is a vast MMORPG game I used to play a lot of, nowadays I'd be lucky to get an hour or two in. But in one of their recent updates, they added keys to the inventory wallet, this was a big deal! Because keys always used to take up valuable inventory place, the wallet was reserved for your hundreds of various currencies. As good as this change was because it freed up a lot of inventory space it added quite a cumbersome experience to the users when looking for these keys. It wasn't until they added even more stuff into the wallet that the poor experience was noticed. For example, if I wanted to know how many of a specific key I had, I would press "I" for the inventory, click the wallet icon in the bottom left when I would be presented with a huge scrolling list of all kinds of currencies, items, keys and who knows what else. You can then filter the results with a drop down bar at the top to see just keys, dungeons currencies, map currencies, etc. Not only is this pretty cumbersome and annoying (a lot of clicks) in the heat of a battle or trying to control 2 things at once while looking for your keys is a horrible experience and downright frustrating.

My Role & Solutions

The steps to get the information you need had to be a lot quicker. After looking at the current interface and sketching out a few ideas for simplifying the process I figured it would be good to move that original drop-down menu straight onto the bottom of the inventory window. After some initial mockups, the idea of a dropdown wasn't looking very optimal for a good and fast experience. So moving the drop-down menu items onto the actual bottom of the inventory, next to the wallet icon looked like a good solution. I used well-known icons to show what each item would be, as most users in the game would be very used to the icons and what they mean. The end result meant that when you wanted to look at your keys quickly, we managed to go from a 4 click process to a 2 click process, improving the user experience and making life that little bit easier. 

Reflection

This was a fun challenge because I experienced the frustration of myself, I understood the user needs completely because I was that user. Getting into the mind of the user is so critical to a successful product, this is a good reminder to me that user research is a huge asset to any design process.

Challenges & Problems

The current portfolio does now show off my UX Design skills, process or thought and planning behind the final product. As my expected users would be potential employers, clients and recruiters. It is very important to show my UX Design process and not just a pretty picture. I needed to design room to talk and express the problems, challenges, solutions and my role in that project. I also understand that my typical users are probably in a rush and don't have time to go through pages of my portfolio, so it has to be lightweight, easy to read and simple.

My Role & Solutions

First, I need to understand what my users want to see from a UX Design portfolio. Then I need to focus on my goals to figure out what I want to show them. I know my users want to see my understanding of user needs, so it has to meet their needs otherwise it would be a bit ironic as a UX Designer to have a crap portfolio experience. I decided to keep it all on one page, short and sweet for people who don't have a lot of time to look at portfolios. The main point here is to show my working and process, not the fancy images, I have a Dribbble account for that. But sometimes two images won't cut it, so I need to have the ability to link out to more images if needed. A small button right under the two default images was a good spot.

Reflection

This is a pretty good experiment for a UX Designer, designing the very thing you need to show off your designs. It’s not something a UX Designer should struggle with if you apply your normal process to your own portfolio. I see a lot of designers go a bit crazy on their own websites, using weird interactions and poor usability. Just keep it simple, focus on what your users want to see, then make it as pretty as possible.