Tatiana Szewczuk Photography
Enhanced web presence for both desktop and mobile
Project Type
Website for desktop and mobile
Role
UX/UI Designer
Tools
Figma, Zoom, Google Suite
Time Frame
November 2023 - March 2024
The Challenge
As a freelance photographer, Tatiana Szewczuk wants to take her photography business and grow as a brand. Tatiana usually posts and promotes her work on social media platforms like Instagram, Facebook, and X, but feels there are limitations on these platforms. She wants to be able to share her work and expand her client base.
The Solution
Creating a personal brand online to showcase work professionally and help increase client base by 30%
What information do other photographers or photography studios show on their website?
I understood that while Tatiana is a freelance photographer, she had two main competitors to consider:
-
Freelance photographers
-
Photography studios
It was important to understand how these photographers/photography studios are able to have a consistent client base. From looking at a multitude of websites, I recognized that all websites had the following common sections:
-
Home page
-
About page
-
Contact page
-
Portfolio/Works
Empathizing with current and future users
To understand how users go about booking a photographer, I recruited 2 groups of people; 2 of Tatiana's clients and 4 who have not booked with her before.
​
When recruiting interviewees, I wanted to recruit from different age ranges and life stages.
Tatiana's clients:
Not her clients:
User Interview Insights
Life milestones
Photos don't get taken unless it's a major life event (engagement, graduation, etc.)
Research
-
Social media first then website if interested
-
If they are unable to find a photographer they want, they ask friends or family for recommendations
Difficulty
It's hard to find the photographer's services on social media
Identifying the target user
Based on the user reach I conducted, I identified the needs, behaviors, and frustrations shared among the group of participants. This persona helped me remember who I was designing for.
The Problem
Inexperienced clients need a way to see a photographer's services because they want their major life milestones captured.
Designing for the persona
From the user interviews, all 6 participants mentioned that they utilized mobile first. It was important to focus on the mobile design before creating the desktop.
The first iteration:​
With my initial frames, I wanted to create a similar layout that I saw other websites utilize when showcasing their work. I wanted to replicate how other photographers utilized images with different categories.
Mobile:
Works
About
Testimonials
Contact
Home
Web:
Home
Testimonials
Works
About
Contact
Going back to the drawing board
When presenting my initial ideas, I recognized that persona was not considered and Tatiana wanted a minimalistic design.
Updating the frames
Mobile:
For mobile specifically, the only change needed to be made was on the home screen as all the other screens remained the same.
I removed the other category images and instead focused on having a carousel that would show Tatiana's top pictures as well as give an option to see her photography services and method of contact.
Web:
Home
Testimonials
Works
About
Contact
Are users able to understand the overall website?
It was important to see if users were able to easily navigate the website. Using Zoom, I had users share their screen with me and walk through a series of tasks.
The overall website was understandable. However,
1
2
1
4 out of 6 users thought "Book Now" and "Contact" meant different things.
2
3 out of 6 users clicked on the photography service icons first.
For mobile:
1
1
6 out of 6 users users would have liked everything to be seen at once without scrolling
All 6 users mentioned that they would like the background color to be lighter.
Building the website
Addressing the usability
With the feedback that I got from user testing and Tatiana, I made a few changes that addressed the user needs and Tatiana's preferences.
1
2
3
4
-
Button was changed to "Contact Me" to keep consistency
-
Icons are now clickable to other pages. Tatiana also mentioned she would like more services listed on her home page
-
The side bar navigation has more categories listed as well as the social media icons being listed below the logo
-
Overall background was changed to a lighter color
Additional changes:
From our meeting, we realized the Testimonials page looked very text heavy and wanted to make each individual testimonial stand out and easier to read.
Tatiana mentioned her About page had too much white space. To fill up the page more, I included a background around her image and put additional contact information text.
Wix
Tatiana wanted her website built with Wix and gave me her account information allowing me to start building out her photography site.
As a website building platform, this restricted me as a designer since I was only able to design the website on Wix's website editor.
Finished Website & Next Steps
The website was published in March of 2024. Tatiana had mentioned in the future, she would like to add more categories as well as implement a shop feature to sell photocards. As of right now, there are no updates to be made, however, she would let me know if she needs me to make any adjustments in the future.
Key Takeaways
This was the first project I worked on where I had a chance to collaborate with the client directly. It was important that I understood what Tatiana's needs and goals were as well as balancing the users' needs and goals.
Some key takeaways from this project were:
-
Communication is important. Throughout the project, Tatiana and I constantly communicated and as a result I was able to understand her needs much more clearly. I made sure that Tatiana was updated as I was working on her website so that she understood what was happening.
-
Always be willing to scrap your designs. I realized as I was working on my first iteration of frames that it did not address the persona I created and didn't suit Tatiana's style. It was important to scrap the idea and think of different solutions before making the solution.
-
Understand the limitations of a website building site. I learned in the early stages of building her website what Wix was capable and incapable of doing. While I can do certain features on Figma, it didn't mean it would work on Wix.