KittyKat, a creative tech agency that provides brands with high-quality visuals in the form of photography, stop motion animations and videos that can be used in advertising and e-commerce.
UX/UI Design
Project Management
According to the company (KittyKat), it had clients that they were creating photography and visuals for, but both the company and their clients felt that the whole process was messy. The company would start a conversation with clients on WhatsApp, then transition to email. The photoshoot would take place, and visuals would be uploaded onto Pixieset, and clients would be invoiced separately through Xero. There were too many separate platforms to keep track of.
Leading stakeholders in KittyKat had identified the above problem, and believed that what needed to be done was to develop a digital, web-based platform that could be used by both the company and its clients, on which all essential interactions (messaging, downloading and purchasing images, invoicing, and more) could take place, thereby centralising as much as possible of the currently messy process.
As the sole in-house UX/UI designer, I was responsible for all steps of the process, working with only one other freelance UI designer when developing wireframes and high-fidelity screen designs.
To begin, I designed a quick proof of concept to broadly demonstrate the idea of the platform - what it could look like and what it was intended to do.
Next, I interviewed several of the company’s current clients to understand their experience of working with KittyKat: pain points and how the process could be improved, what they liked most about the process, and the broader view of their entire process of obtaining brand visuals.
Using the proof of concept I designed, I also gathered feedback about the proof of concept. Interview data was used to confirm that clients did indeed have difficulties with the process (as KittyKat stakeholders had mentioned), thereby validating the product concept and also to generate ideas on what features would be useful.
Before starting on the designs proper, I collated information about the features and capabilities that company stakeholders wanted the platform to have. I spoke with KittyKat staff (who would be using the platform to upload assets and communicate with clients) to understand their existing process of working with clients and how it could theoretically be improved with this new platform.
With this knowledge, I used FigJam to map out user flows for an internal (staff) dashboard and an external (client) dashboard, both of which had to seamlessly connect in order to effectively deliver photos and videos taken by KittyKat to the clients.
The user flows were used to confirm my understanding and interpretation of stakeholder needs with stakeholders themselves, and to communicate an initial broad view of the product requirements to developers that we would be working with.
Once user flows were mostly confirmed, I started crafting wireframes to illustrate how the user flows could be visualized in a digital interface. I then created wireframes corresponding to each step of the user flow. In the process, I worked closely with stakeholders in regular walkthrough meetings to confirm that my visual interpretation of their desired features was on track.
The UI design process was divided into two batches according to parts of the process of working with clients: first, the process of booking a photoshoot leading up to the shoot actually taking place, and second, the process where the client would receive, browse, purchase and then download the images from the shoot.
Once the wireframes (and the relationships between them) were mostly finalised, I moved on to the high-fidelity UI designs.
To begin with, I created a web style guide to standardise visual and UI design, including the colour palette, typography, buttons and forms, and other aspects that had to be visually consistent.
I then designed high-fidelity UI designs based on the wireframes and according to the style guide. Due to the sheer volume of screens that needed to be designed, I gave directions and worked with a freelance designer who followed my style guide, wireframes, and user flow diagrams to design some sub-areas of the platform. We had to flesh out the two interlinked aspects of the platform - the client-facing area (for KittyKat clients), and the internal staff-facing area (for KittyKat staff).
I also prepared detailed UI notes to communicate to developers how the design should be implemented during front- and back-end development.
The developers worked on building out my designs and regularly updated me with demos. I was in charge of QA testing - identifying bugs and ensuring that the developers’ work was faithful to the designs I provided.
At various stages of development, I compiled detailed documents and screen recordings to inform them about bugs, clarify misunderstandings about the design and give feedback on their builds, working with them to ensure that the stakeholders’ vision was fulfilled.
This project operated on a fairly tight timeline, as KittyKat was a new startup company that had a lot of investor commitment depending on getting a working platform up as quickly as possible. Stakeholders were already convinced of the value of this concept and wanted it executed quickly and efficiently. Therefore, the company prioritised deliverables and results over important UX processes, perhaps understandably due to these funding and timeline restrictions.
A concern of mine was that ideally, more user research should have been done with the company's clients (the other side of the equation) to corroborate claims about the need for this platform and to find out how better to account for clients’ needs.
An additional concern was that no formal usability testing was done during the design process. Instead, presentation/walkthroughs of wireframes and early designs to stakeholders and staff in the company, followed by receiving verbal feedback on whether the designs were meeting company-side needs. User testing of early prototypes and throughout the UI design process would have been ideal to highlight usability issues and perhaps to highlight how some features could have been improved, removed, or added, to best serve user needs. Instead, I had to put together a complex dashboard design using my own UX expertise and standards to ensure usability, instead of real user testing.
Currently, key clients have been onboarded onto a working basic version of the platform. They are able to book new shoots and receive updates and communications regarding their upcoming shoots, as well as access and purchase all their visuals centrally.
Translated requirements and wants from stakeholders into plans and specifications for a real product.
Further refined my skills in collaborating with stakeholders to articulate their product vision.
Learned to keep track of evolving project specifications and business needs to ensure that the product was meeting stakeholder requirements.
Learned to take point and establish the design direction (in terms of both UX and UI) for a large project.
Refined skills in creating visual representations of user experience flows. This ensured that developers and other designers on the team could understand the required functions that users should be able to execute.
Refined skills in creating a visual style guide to standardise the look and feel of UI elements and thereby ensure consistency.
Being detailed enough and communicating features and design requirements clearly to developers
Working with developers to find the best UX and UI solutions to fulfill project requirements, based on timeline and ease of execution
Navigating problems where developers misunderstood design requirements, and communicating bugs and needed improvements to the build
Being confronted with the reality that sometimes, business and stakeholder demands can clash with ensuring that UX best practices are followed (proper research and testing, etc.). Sometimes there just isn't enough time and money, and a leaner approach has to be adopted.
Gained a greater understanding of finding a balance between UX best practices and what stakeholders think they need, especially in environments lacking a mature understanding of UX.
If you’d like to work with me, or even just ask some questions, let me know!
Contact me