top of page

Tatiana Szewczuk Photography

Enhanced web presence for both desktop and mobile

Group 1.png
Iphone 14 - 1.png

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%

Group 1.png

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:

  1. Freelance photographers

  2. 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:

set-user-avatar-male-and-female-icon-person-icon-in-black-colors-vector-removebg-preview.png
set-user-avatar-male-and-female-icon-person-icon-in-black-colors-vector-removebg-preview.png

Not her clients:

set-user-avatar-male-and-female-icon-person-icon-in-black-colors-vector-removebg-preview.png
set-user-avatar-male-and-female-icon-person-icon-in-black-colors-vector-removebg-preview.png

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. 

Persona.png

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:

Mobile Home (Design 1).jpg
Mobile Works Page (Design 1).jpg

Works

Tat Web Mobile About (Design 1).jpg

About

Tat Web Mobile Testimonials (Design 1).jpg

Testimonials

Tat Web Mobile Contact (Design 1).jpg

Contact

Home

Web:

Desktop Home(Design 1).jpg

Home

Testimonial Page (Design 1).jpg

Testimonials

Works Page (Design 1).jpg

Works

About Page (Design 1).jpg

About

Contact Page (Design 1).jpg

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.

Mobile Home (Design 2).jpg

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:

Desktop Home (Design 2).jpg

Home

Testimonial Page (Design 2).jpg

Testimonials

Works Page (Design 2).jpg

Works

About Page (Design 2).jpg

About

Contact Page (Design 2).jpg

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,

Desktop Home (Design 2).jpg

1

2

1

Frame 275_edited.png
Frame 275_edited.png
Frame 275_edited.png
Frame 275_edited.png
Vector_edited.png
Vector_edited.png

4 out of 6 users thought "Book Now" and "Contact" meant different things. 

2

Frame 275_edited.png
Frame 275_edited.png
Frame 275_edited.png
Vector_edited.png
Vector_edited.png
Vector_edited.png

3 out of 6 users clicked on the photography service icons first. 

For mobile:

Mobile Home (Design 2).jpg

1

1

Frame 275_edited.png
Frame 275_edited.png
Frame 275_edited.png
Frame 275_edited.png
Frame 275_edited.png
Frame 275_edited.png

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.

Desktop Home.jpg

1

2

3

4

  1. Button was changed to "Contact Me" to keep consistency

  2. Icons are now clickable to other pages. Tatiana also mentioned she would like more services listed on her home page

  3. The side bar navigation has more categories listed as well as the social media icons being listed below the logo

  4. Overall background was changed to a lighter color

Additional changes:

Testimonials.jpg

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.

About.jpg

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. 

70ee88ea-9f78-454a-ba0c-0392aaa35267.png

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. 

Group 1.png
Iphone 14 - 1.png

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:

  1. 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. 

  2. 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. 

  3. 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. 

bottom of page