With an increasing trend in online bloggers, influencers, and social media personalities, and from journalism students to students studying fashion, crafting perfect images is becoming increasingly relevant. Currently, there does not exist a platform that connects beginner with expert photographers, where beginners get one-on-one guidance from experts, and experts mentor up and coming talent that may join their team one day. Photography apps and forums offer an impersonal way to connect with other photographers, with no guarantee of a timely response, if any at all.
This is the gap in the market Protograph hopes to address. Protograph offers its users the ability to contact experts in the photography industry via chat, audio, and video calling options, as well as offering an in-app photo editor and screen-sharing, so novices and experts can remotely collaborate on a project, together.
After analysing the problems faced by a potential Protograph user, and the existing gap in the market, the next step was to conduct a competitive analysis. Naturally, Instagram was by far the most direct (and obvious) competition.
Analysing Instagram was really fun! For the first time, I was using Instagram not as an avid fan and user, but as a potential competitor. Admittedly, though, it was an effort to switch between these two roles, and analyse from a critical perspective an app I use so regularly.
In the end, I had an even greater appreciation for Instagram, this time from a UX standpoint.
Conducting user interviews was great, the process of coming up with the questions, not so much. The first two drafts of most of my questions were too vague (because i associated being direct with being rude!). I’d phrased questions like “would you be willing…” and “what is your opinion on…”. I had to revise my questions four times to get them right, and the difference between the first and the final draft was stark: by the end, my questions were concise, direct, open ended, and still polite!
As nervous as I was, starting this task, I actually ended up enjoying it. I did however enjoy conducting interviews more than coming up with the questions. To get that information first hand from (potential) users themselves, going off-script when necessary, and getting insight into how they think, behave, talk, what they do and don’t respond to, it’s amazing!
For this project, I interviewed Undergraduate students of Fashion Marketing from London, an aspiring Instagram influencer, and a freelance photographer with a 5 year experience. Using affinity mapping, I sorted and analysed data to help me create the user personas.
My focus was a lot more on functionality than just the design itself. I let the functionality requirements of the app lead the way for its design. I wanted a clean interface, reminiscent of Facebook and Instagram, so first-time users already feel a sense a of familiarity. Essentially, my goal was for users to get every task done with minimal taps and clicks.
Upgrading hand-made sketches to digital sketches made it all feel like coming to life. Learning to use Balsamiq was really easy and seamless. In fact, I found designing on Balsamiq a lot more easier and quicker than hand-drawing sketches, And it certainly made updating my design much more faster.
I found usability testing more enjoyable than what I had imagined it would be like. Watching and listening to participants interact with my prototypes was really exciting. Going in, I thought that hearing strangers talk about my project in a negative way might be difficult for me, but that wasn't the case at all. In fact, with two participants in particular, I had to encourage them to be vocal about all the things they find “wrong" with the app. It would have been of little help if they only were to say how well I’ve done. Because I knew all the participants personally, I knew they were trying to be nice by not critiquing the work I’d done, when I needed actual, constructive feedback. So making them feel comfortable by telling them that their feedback is only helping me and not hurting my feelings, their feedback helped me make changes to my prototypes that when I tested the revised versions with a different participant, things went much more smoothly!
Research Findings
The goal of the usability test was to examine how first-time users interact with the app on mobile and desktop, and the ease with which they are able to successfully execute a few select tasks. Specifically, I observed how users interacted with the app when contacting an expert through the app, how easily could they identify the screen sharing icon, and how comfortable did they feel about sharing their screen with a stranger.
I was also able to get participant’s input on how satisfied they are with the app, in terms of ease of use, and the overall design aesthetics.
Errors were measured using Jakob Nielsen’s scale.
Overall, all six participants had a great response to testing the prototypes. Despite being confused about certain elements, especially screen sharing, they said to have enjoyed the process. All six participants said that the interface is straight forward and easy to use, and reminded them of Facebook, Instagram and LinkedIn, also adding that there are elements from those apps that made the tasks easy to complete.
Changes
After the feedback from usability testing, peer review, and A/B testing, I made the following changes:
-
Five of the six participants had trouble completing the task of adding pictures to their ‘Photos’ album. Before, users had to click/tap the “Profile” tab/icon to access the “Edit Profile” option that would let them add pictures to their album. After the feedback, I added a separate “Add Photos” icon next to the Photos gallery so users can add images easily.
-
Five of the six participants had difficulty in locating the share screen icon to complete the task. To make this task easier, I included this feature to be explained in the extended onboarding for first-time users, as well as labelling the screen sharing icon, to make it easier for users to access that feature.
-
As per the feedback, I also changed the location of a user’s “Favourites”; moving them from the home screen to their profiles.
-
Two of the six participants confused the previously-used heart icon to “like” a profile as opposed to “favourite” it, as intended. Therefore, I changed the heart icon to a star icon, which is more closely associated with marking an item as favourite.
-
Create my own photo-editing toolbar instead of the placeholder image I had used for my wireframes.
-
Keep the original layout for the desktop home page
Interface Design
One of the first things I did at the beginning of the project, when I decided on the name of the app, was to come up with a logo. The first logo I designed looked alright, but only when zoomed in so you could see all the details clearly. When I scaled it down to the iOS app icon size, it did not look anything special, distinguished, or recognisable. So I knew I had to change that and come up with something that would work for all different sizes.
How I came to design the current logo was that I took a piece of paper, tore it into a strip and made it into the letter “P”. Then, I sketched the design on a piece of paper, noticing where the folds were, where the lines met, and where the shadow was cast, and then proceeded to design the logo in Sketch. And i really, really enjoyed the process.
Old logo Current logo
Creating the Design Language document was perhaps the most painstakingly laborious task so far. The screens I had designed, were designed arbitrarily. Majority of the design elements were similar, but there were instances, for example, for the profiles for Naomi and Richard on the mobile version, the text size for their usernames were different by 0.5 px, which I had to change and make it one size. That level of detail was a lot to process at first, but making those changes, and keeping in mind the iOS Human Interface Guidelines, made the end product look more polished and refined.
Thank you.