DOROTHY DELONG
Single-Page Portfolio Website
Project Overview
Dorothy Delong is a dynamic photographer whose focus is on candid portraiture that captures empowered women engaging with their environments. Not having an existing website, Dorothy needed a place to highlight her bold approach to her work and, most importantly, a clear way for prospective art-focused magazine and museum clients to make inquiries.
Project Role & Scope
Dorothy hired me as sole designer to help her reach her goals. I was responsible for the full process of design including:
-
Market/Competitor Research
-
Wireframing
-
Developing Cohesive Look and Feel (Color schemes, type scales)
-
Feedback and Revision
-
Refined Design Comps for Developer Collaboration
-
Final Deliverable: Single-Page Portfolio Site.
Project Goals
Primary among Dorothy’s goals was to develop a website that would replace her physical portfolio. As she has become more successful, a pain point for her has been how to share her work more seamlessly. To address this pain point, Dorothy wanted a website that shared her perspective through a photo gallery and artist statement so she could increase her reach to magazine and museum clients.
Problem
Solution
How might Dorothy’s website entice museums and publications to explore her work and connect with her for collaborations?​
The solution was a single-page portfolio that included her artist statement, a selection of her images, and direct contact links. The site design provides a strong foundation that can be added upon as needed in the future.
​
Clear navigation and straightforward contact sections were important functional components of this site’s design, but Dorothy’s visual work needed to be central as images do most of the heavy lifting in her industry.
​
The layout of her images references the geometry of her logo and emphasizes the vitality of her design philosophy. It is a system that can easily be expanded upon as her portfolio grows.
Tools
​​
-
Adobe Photoshop
-
Figma
Team
​
-
UX/UI Designer
-
Artist Client
Timeline
​
-
1 week: Research
-
1 week: Visual Design
-
1 week: Prototyping & Hand-off
Design Process
01.
Research
02.
Sketching &
Wireframing
03.
Color & Type Design
04.
Prototyping
05.
Refinement & Hand-off
Research
Competitor analysis allowed us to examine portfolio sites of other artists to determine which features were most desirable for Dorothy’s site.
Sketching/Wireframing
Low-Fi Idea Development
Quick sketches are an efficient way to communicate visual ideas that incorporate client wishes and goals.
Digital Wireframing
Beginning in Adobe XD and eventually shifting to Figma, I was able to play with scale, proportion, and flow with a bit more specificity.
UI Design
Once the functional goals of the site were clarified through wireframing, I worked to incorporate the client’s values and aesthetics into the look and feel of the site. The final color palette is derived from Dorothy’s images without competing with them. Colors needed to be limited to keep the user focused on Dorothy’s imagery. Selected typefaces speak to Dorothy’s strong vision of power and humanity.
Prototyping
After exploring the sites of Dorothy’s competitors it became clear that a simple but dynamic site that foregrounds her photography was a primary goal. Initial wireframing and prototyping were tested on mobile devices, but we later switched to laptop prototypes to better showcase portfolio images. Through interviews with prospective museum and print collaborators we determined that they would most likely review her work on laptop or desktop screens rather than phones or tablets, which helped validate this decision.
In order to emphasize the vitality of Dorothy’s work, I built a simple but energized layout to pull the visitors into Dorothy’s world. The gallery’s diagonal frames borrow from Dorothy’s existing logo and bring movement to the layout.
​
Her site needed to offer a portal into her active social media accounts and straightforward ways for interested clients to contact her quickly.
Scrollable Laptop Mockup of Dorothy Delong's portfolio site.
You may also view this Figma prototype in a larger format if you wish.
Next Steps
Should Dorothy wish to add additional functionality in the future, the site structure can flex to accommodate such changes; added features such as form submissions and retail components could all be built into the site should Dorothy’s business require them in the future. Gallery Images will be rotated out as desired.
​
Additions that Dorothy would like to make based on competitor research are that she would like to add a CV and press-clippings for prospective clients to view.
As her portfolio grows, she'd also like to set up category-based pages so that she can point clients to particularly relevant pages when needed.
​
Learnings
This project reiterated the Steve Jobs quote “Simple is hard.” Editing is key to strong design and a one-page website is a great way to practice that! Especially when dealing with artist portfolios, a website’s design should provide a framework to highlight images rather than foregrounding its own personality.
​
As with many design challenges, this site’s one-page format and functional goals required restraint and thoughtful editing. From initial research and sketches through to prototype and asset exports, this project required strong design aesthetics and attention to detail, both visual and technical.
​
Similarly, this project offered a great opportunity to develop a strong and tight workflow so that handoff to the developer was snag-free.