Ivy Corkill UX Designer

Dorothy Delong

Executive Summary

Dorothy Delong is a conceptual photographer who had a potential client complain about the process for licensing her work. This led Dorothy to believe other users might abandon the licensing process due to confusion and discomfort.

My research identified key usability issues related to unclear navigation, insufficient context about Dorothy’s work, and a lack of intuitive contact pathways.

I redesigned the portfolio as a one-page, artist-focused experience that:
  • Clarified the purpose of the site
  • Surfaced contextual contact options
  • Simplified the process for identifying and inquiring about specific works
Usability testing across two iterations demonstrated significant improvements.
The Original Site
The Final Prototype

Introduction

I originally designed and developed Dorothy Delong’s photography portfolio in 2020 while completing my Front End Development bootcamp at Skillcrush. In 2025, I revisited this project through the lens of a UX designer. This evolution showcases not only my technical growth but also my shift toward a more user-centric design philosophy

My Role: Lead UX Designer
My Responsibilities: Diagnosed usability friction through user research and executed an iterative design-to-test workflow to ensure product-market fit.
Tools Used: Figma (High-Fidelity Prototyping), remote/in-person user interviews, and usability benchmarking.

To ensure I understood the root issue, I conducted user interviews for the original website. This highlighted a surprising problem in addition to the client's concern: people did not understand the purpose of the website upon first impression.

Based on these insights, I implemented a new design that added contextual information to the photographs (labels and captions) and clarified contact methods. Subsequent user testing validated that the new design was effective and concise.

About Dorothy Delong

While Dorothy Delong maintained high engagement and consistent traffic, her portfolio failed to convert visitors into inquiries. When contact was initiated, it was often through fragmented social media channels using vague descriptions. This forced Dorothy to guess which images clients were interested in, creating a baseline of confusion and friction for both the artist and her potential customers.

Project Goals & Scope

Create a high fidelity, single-page composition that aligns with Dorothy's editorial brand. The composition should be appealing to publications such as magazines, should attract art shows and exhibits that want to display her work, and fit the following parameters:
  • One page - for minimal content to update
  • Include artist’s statement, mission statement, photo of Dorothy
  • A small sample of her work
  • Contact information and social media links
%
of users successfully contact Dorothy about photo licensing.

Discovery & Research

My Initial Hypothesis

I began the project by targeting two suspected barriers to conversion:
  • Identification Gap: The inability to clearly reference specific photographs during an inquiry.
  • Lack Of Direction: The users are not told to take any specific action that would guide them to convert.
Through user interviews, I was able to identify an important additional problem: users did not immediately understand the purpose of the website.

  • Participant Information

    For the process of the user interviews, I had test 3 subjects attempt to walk through the process of contacting Dorothy for a photo. When asked about their comfort with technology, all considered themselves general competent using computers, but each to a varying degrees; one participant worked in IT. Three seemed like a sufficient number for initial research because this website seemed pretty simple with minimal functions.

  • User Interview Prompt

    Please know that we are not testing you, we are testing this website, so rest assured that there is nothing you can do or say that is wrong. Your feedback is extremely helpful to me, so as you proceed through the study, share as many of your thoughts and feelings as possible - even if they seem irrelevant. You may have questions throughout the process that I cannot answer, and just know that I will probably respond to your questions with additional questions. At the end of the study, we will discuss your questions. Please pretend that you are a potential client and hoping to use their products or services.

    As needed, I would prompt for more information about their thought process. This included general questions about what they thought of the page, did they understand the purpose of the website, and what different aspects made them feel.

Key Findings

The most critical insight was a significant lapse in immediate orientation. User testing revealed that participants required approximately 30 seconds of exploration before identifying the site as a professional photography portfolio. This delay in "time-to-understanding" created a high risk of bounce and task abandonment.

This required me to add a new goal:
Seconds maximum time to understanding
User Flow & Friction Points
I mapped the existing user journey to highlight several non-intuitive interactions that stalled the experience:
  • Obscure Navigation: The primary menu was located below the fold, leaving users without a clear "roadmap" upon entry.
  • Lack of Affordance: The photo gallery lacked visual signifiers (such as hover states or icons) to indicate that images could be expanded via a lightbox.
  • Ambiguous Intent: without a clear value proposition above the fold, users were unsure of the website's purpose.
Key Usability Barriers

1. High Social Friction (The "Cold Call" Hurdle)
User testing revealed a significant emotional barrier: participants felt a distinct discomfort with the perceived requirement to "cold call" the artist. They viewed this level of manual outreach as an unnecessary burden, leading to immediate task abandonment. This highlighted a critical need for a low-friction, digital-first inquiry method.

2. Lack of Interactive Affordance (The Lightbox)
The "Lightbox" feature suffered from a total discoverability failure. 100% of users failed to interact with the feature because the UI lacked visual signifiers (affordances) to indicate that the images were clickable or expandable.

3. Mental Model Mismatch
Users entered the site expecting a streamlined licensing or contact flow, but the interface felt like a static gallery. This misalignment caused users to give up before reaching the "Action" phase of the journey.

User Personas: The Curator & The Patron

To bridge the gap between Dorothy’s raw, authentic imagery and the needs of her professional network, I developed two distinct personas, and italicized their points of common ground.

The Curator: High-level decision-makers for magazines and art exhibits seeking "imperfect beauty" and authentic human narratives for complex story telling.
User persona for Darwin Arquette - she is a publisher who may want to use Dorothy's work in her magazine.
The Patron Patrons and readers who value digital authenticity and are drawn to raw, unpolished scenes of humanity.
I integrated SMS/Texting as a primary Call to Action (CTA) alongside traditional email to meet the preferred communication methods of these age demographics. This directly addresses the "cold call anxiety" identified in research by providing a modern, low-pressure inquiry pathway.

Ideation

To align Dorothy’s "edgy" brand with a high-end professional experience, I structured my ideation around three core "How Might We" questions:
  • Conversion: How might we lower the barrier for users to initiate professional inquiries?
  • Engagement: How might we encourage deeper exploration of her photographic narrative?
  • Clarity: How might we eliminate "time-to-understanding" friction and instantly signal the site’s purpose?

  • Matrix Method Columns

    Row 1: contact methods

    1. Email Me / Call Me buttons

    2. Contact form

    3. Contact buttons beneath specific images

    4. Contact info/message encouraging users to contact her by the about me section

    5. Contact form next to photos

    Row 2: image viewing

    1. Image slider

    2. Masonry Gallery - image info shows during lightbox

    3. Traditional Gallery with captions on the bottom

    4. Cards display

    5. Photo / description alternate sides, scroll to each photo

    Row 3: About dororthy info

    1. A cool graphic that makes her statement look like it’s coming out of a speech bubble

    2. A cool graphic where her take away message is in the graphic with her/behind her

    3. A cool graphic where her message reflects in the lens of a camera

    4. About my work paragraph at the beginning of the portfolio section

    5. Add an “About Dorothy” section, add it here

    Row 4: Brand relatability

    1. Make the lens of her logo rainbow

    2. Edgy background graphics

    3. Add a “Books I love” section to showcase her identity a bit more

    4. A paragraph describing the context of each photo - it’s rawness/reality

    5. Feminist blog

  • Rolling Outcomes

    I’ve italicized my favorites and crossed out the ones that felt unhelpful.

    I also established a clear user flow to display how users should be able to simply navigate the site. 

    Combo 1: 10, 15 - Alt photos could smoothly transition to photo of Dorothy, which includes her badass mission statement. Would be cool with parallax bg


    Combo 2: 1, 15 - Dorothy’s About section includes contact buttons 


    Combo 3: 19, 1 - About this photo section has contact buttons near it to indicate they can contact her about this photo


    Combo 4: 18, 11 - Books I love underneath a cool statement graphic. Could be part of a large About Dorothy section


    Combo 5: 10, 9 - We could make the photos look like they were taken on polaroids, have descriptions next to them. A soft box shadow could make the images look like they are literally on the page. 


    Combo 6: 19, 16 - Alt logo in the blog section


    Combo 7: 3,5 - A contact form by each photo, and call/email buttons as an alternate option


    Combo 8: 9,6 - A card slider


    Combo 9: 7, 17 - A masonry callery with grungy background graphics


    Combo 10: 19, 8 - Simple gallery with label, lightbox effect reveals caption/about description


I started with a mid fidelity prototype to map out my working solutions.
I began with a mid-fidelity digital prototype to establish a structural foundation and map out functional layouts.

Driven by early momentum, I moved straight to high-fidelity design after refining the copy, skipping a dedicated wireframe testing cycle. This was a critical misstep. Advancing without immediate validation inadvertently masked structural flaws with visual styling—a lesson that became starkly apparent during the first round of usability testing.

Validation User Testing

To validate the effectiveness of my prototype, I organized another round of user interviews.

I provided test subjects with the same prompt as before

  • User Interview Prompt

    Please know that we are not testing you, we are testing this website, so rest assured that there is nothing you can do or say that is wrong. Your feedback is extremely helpful to me, so as you proceed through the study, share as many of your thoughts and feelings as possible - even if they seem irrelevant. You may have questions throughout the process that I cannot answer, and just know that I will probably respond to your questions with additional questions. At the end of the study, we will discuss your questions. Please pretend that you are a potential client and hoping to use their products or services.


    As needed, I would prompt for more information about their thought process. 


Iteration I

The first round of testing revealed a persistent "Identity Crisis." Despite the structural changes, users still struggled to pinpoint the site's purpose:
  • Brand Confusion: One participant mistook the logo for a browser advertisement (due to a resemblance to the Google Chrome logo), while others associated the site with general "feminist branding."
  • The "Skimming" Factor: Without high-fidelity imagery to provide instant visual context, users relied on paragraph text. However, most participants skimmed the copy, missing the "Photography Portfolio" identifier entirely.

Technical Hurdles & Prototyping Lessons

This iteration highlighted a critical technical oversight: Asset Optimization.
  • The "Pixelation" Trap: I used raw, high-resolution files that Figma’s prototyping engine struggled to render. This caused the work to appear pixelated, leading users to believe the site was a tech blog rather than a professional portfolio.
  • Navigation Discoverability: Only one user attempted to interact with the carousel. Because it was non-functional in the prototype, I lacked data on its actual usability.

Silver Lining

Despite the identity confusion, the Conversion Path showed promise. All but one participant successfully identified the contact pathway when prompted, validating that the new "Information Architecture" was a step in the right direction.

Iteration II

For the second round of iteration, I made the following changes:
  • Asset Performance: I optimized and re-imported all high-resolution imagery, ensuring the Figma prototype rendered the work with the professional clarity required for a photography portfolio.
  • Visual Hierarchy Shift: I moved the photography to the forefront of the layout. While Dorothy is the brand, her work is the product, and it needed to be the primary focal point.
  • Above-the-Fold Orientation: I added a high-contrast, bold title to the header to immediately signal the site's purpose, eliminating the previous "time-to-understanding" lag.
  • Actionable Copy: Based on user feedback, I updated the gallery CTA from "View My Work" to "Contact Me About My Work," creating a more direct link between browsing and inquiring.
  • Functional Prototyping: I built out the carousel navigation to allow users to interact with the slider naturally, providing a more realistic user experience.
Take Me To The Final Prototype Please
For this second investigative cycle, I ran targeted follow-up sessions with 2 key participants to verify the structural fixes

This time, users immediately understood the purpose of the website.

Participants noted that the "edgy" aesthetic clearly signaled Dorothy was not a wedding or portrait photographer. While I noted this, I viewed it as a successful niche filter. To further clarify this in future versions, I proposed adding a "Press & Exhibitions" section to provide instant social proof for her editorial goals.
The participants at this point were all able to figure out how to contact Dorothy regarding specific photos.

With the core usability goals met and the identity confusion resolved, the design was finalized. Dorothy was satisfied with the outcome, having a high-performance, one-page portfolio that accurately represents her brand and streamlines her client inquiries.

Results

Through two iterations of user interviews, I was able to identify:

1. Users were confused about the purpose of the website.

2. Users could not name specific photos, and were uncertain of how to contact Dorothy about them.

I resolved the confusion about the website's purpose by better utilizing header text, and reprioritizing the content flow.

I resolved the inability to name a photo by adding a clear labeling structure, and by creating an opportunity to give each photo a story.

Validated Outcomes

Usability testing showed that users could identify the methods for contacting Dorothy, and identify what images they were interested in.

Changes to the content flow and labeling also allowed users to understand the purpose of the website more clearly.

What I Learned

This project taught me a lot about avoiding assumptions and rushing to solutions without validating. It quickly became obvious that a huge part of user confusion was entirely different than what I had expected: users could not identify the purpose of the website. In a niche context, such as art photography that may not appeal to the general public, it is important to leave no room for confusion.

I also learned that small language changes can make a big difference in the users interpretation of the actions they should make. It may be most helpful to simply spell it out for them in concise language.

All in all, this project reinforced the reality that assumptions deserve to be challenged in the realm of UX, and it is important to ask obvious, general questions even when we think we know the answers.

Ivy Corkill UX Designer