Visual Design - Fourth Iteration

Despite positive feedback in the usability testing, I felt that I had focussed more on prototyping transitions and functionality, whilst the design side was somewhat lacking in inspiration and flair. On reflection, my previous iteration looked dated, with too many drop shadows and too many orange buttons that worked against each other rather than highlighting the user journey throughout the app.

Feedback showed that the concept of this app is fantastic, and has room for growth and development and following a positive tutor one-to-one, I just felt that I was so proud of my work so far, it was a shame to not use the time I had left to rework the overall design aesthetic.

Food for Thought

“You should never put your focus on creating something unfamiliar. In many cases, design that is different is anything but good.” (Karjaluoto, 2013)

I decided to begin creating an archive of inspiration on my desktop. I needed a place to save screenshots, and images that inspired me. Whether it is a fantastic button design, a fresh colour palette, or a nice drop down hamburger menu design, it’s useful for any designer to keep these resources in one place. All designers, no matter what field of design, are inspired by, and learn from how other designers interpret their skills.

Whilst collating all the images I had already saved on my phone, on Instagram, or even in my mind, I came across some nice examples that inspired me for my fourth iteration. I loved the simplicity of the Last Minute apps’ home screen. I hadn’t considered using such light back ground and text field colours, but I think they work well and really bring focus towards the text. I admire the simple colour palette, and the minimal use of the pop colour for actionable links. Whilst I had used the orange colour on my third iteration, there were just too many actionable buttons on each page.

I also love how the Pets at Home VIP app has lovely graphic elements, such as the love hearts by my dogs’ photo, it adds a sense of fun and whimsy that works so well. I was keen to create a more dynamic home page too, and was inspired to add more elements, such as newsletter subscription and other snippets of other pages (favourite walks, progress).

Redesign

I redesigned the app with new styling and features, and a fresh colour palette. I also wanted to simplify the prototype screens, with a more innovative home screen populated with condensed snippets of content. I felt that there were too many screens, and in particular, the step-by-step guides felt too long with the user required to click chevrons to open up each step of the walk. I felt this could be simplified.

Fig 1. Updated Walkease prototype screens

I also reworked the onboarding screens to create more focus on the benefits in a modern aesthetic and ensured that all elements were aligned to the grid. Fonts were also reconsidered. I decided not to use the Nunito font for body text, instead using Roboto throughout and highlighting headings and body text through font size and weight. This looks much cleaner. I wanted to incorporate the font from the logo as well, so used it for page headings against an opaque pawprint graphic.

Finally, I reworked the logo to a more graphic style with a dog lead wrapping into the text. I felt that it didn’t need to be shown on every page, as previous iterations.

Fig 2. Reworked screens for Walkease prototype (4th iteration).

Reflection

Whilst the last week before hand-in was rather manic to say the least, I felt so proud of myself to keep pushing to deliver a functional and user-friendly app that now had a strong visual story to match. With each iteration, my Adobe XD improved and I managed to export my frames into Figma to create some beautiful 3D presentation mock-ups.

In my previous career working in fashion design, I always had moments when I looked back at previous work and felt surprised by how far my skills had developed, and this was no different. From the initial prototype to the fourth and final iteration, I can clearly see progression in technical and UX design skills.

Future Scope

I’ve really enjoyed working on this project, and have laid the foundations to developing this into a real app. I think there is room for this to expand further.

Based on my original research, I would incorporate the ability to submit walks. I found that one of the key issues with competitor apps was that some users found that nearby walks they already knew of were not listed. Often, people discover their own walks ‘off the beaten track’, and so it would be good to incorporate this as an option. For the purpose of this module, I had to make decisions features to include based on time constraints.

I also think that a map view would work well within this app also, and this was one of the notes I took from my usability testing. As it only provided an optional view, I felt it didn’t alter the ability to address the main user concerns.

I believe there is a social aspect that can be explored in future developments, looking at ways to integrate features that address user safety and health, such as a health monitor that works with wearable technology and tracking displays to show where you’ve walked.

My confidence has grown immensely throughout the course of this project. My initial intentions were to advance my research skills and to test my technical skills. I felt the benefit of working to key design stages (Empathy, Define, Ideate, Prototype, Test) throughout.

I knew I was able to carry out thorough research and analysis as I recognise this as being one of my key UX strengths, however I felt that on previous tasks, I had shifted my focus more towards this than technical skills in the design and deliver stages. However, after creating 4 iterations I felt much more confident in this area too. I look forward to the next project.

References

Karjaluoto, E., 2013. The design method: A philosophy and process for functional visual communication. New Riders.