Website Design: Steph Asavale Photography
ABOUT THE PROJECT
Steph Asavale Photography is a branding photography company based in San Jose, CA. Steph works with small businesses and agencies in the San Francisco Bay Area, Los Angeles, New York, and beyond to help them bring cohesive photography to their brand. Her speciality is clean photos with pops of color. And, being a brand photographer, she wanted a website that reflected her brand - lots of clean, white space with pops of color.
IT TAKES A VILLAGE
Steph had an amazing team of people helping her with this, her very first website:
Sharon at Social Savvy Consulting Group helped with the copy and SEO and did the initial site build.
Hailey from Archer Inspired Photography helped with general Squarespace tips and advice.
And then I came in to clean up the design and add some customizations.
NEW BRAND COLORS
Steph and I were actually working on her systems and workflows in private coaching when she asked me to help her with her website. We had the systems in place and the workflows were ready for clients to start inquiring. All she had left was to finish some of her branding and the website.
First up - new brand colors. Steph had some colors picked out but they still didn't feel exactly right to her. So we took a look at her Pinterest board - but not the board you'd expect. I didn't want to see her branding or website boards. I asked her to look at her clothing board. I did this for a few reasons - 1) Steph didn't have a clue what colors she wanted. She had leanings toward a couple color groups, but no strong feelings. 2) Her brand is a personal brand. It should reflect her as a person. What better place to see her personal style and color tendencies than her clothing board. 3) I knew she tended to wear mostly neutrals with pops of color. And this same color scheme would allow her photos to stand out and allow her branding to be an accent.
And let me tell you, her clothing board did not disappoint! It was obvious within the first 10 pins what colors we should use.
So what did we settle on?
We kept her purple, but tuned it a little more on the blue side. Then we added in a pop of color with a bright coral and bright teal. And we are in love with the combination!
SQUARESPACE CUSTOMIZATION
(AKA - CLEANING UP THE DESIGN)
After we finalized the brand colors, I went in and started tweaking her site to make it exactly what she wanted it to be. Sharon and Hailey had already done an amazing job getting Steph off the ground. And Steph had a great site built already. The design just needed a little polishing to make it really shine. And we needed to connect her site to the systems and workflows we'd just created.
I showed her how to embed forms on her site. And then we embedded her lead capture form from Dubsado directly into her website to ensure that her leads workflow began on her website and could be automated from step 1.
I changed the fonts and colors of pretty much every element within the site - headers, body text, all the buttons, etc.
I added backgrounds to different segments on her page (using index pages)
I cleaned up the organization of her pages so they were clean and easy to find
I adjusted some of the layouts to make them easier to read visually
I gave her advice on sections and blocks to on certain pages
I taught her what all of the different blocks do and creative ways of using them so she can use them in the future on her own
and so much more!
LAST-MINUTE OVERHAUL
The afternoon before she was scheduled to launch her site, I messaged her to see how it was going and if she needed any help getting it finalized for the launch. She was almost in tears because she'd spent most of the afternoon trying to fix the layout of her blog posts. And she just couldn't get it to cooperate.
We ended up hopping on a zoom call (my favorite way to chat with clients) and she said she was thinking about trying a different template. That's right, she wanted to change her template the night before her launch. In her defense, the template she was on wasn't very flexible. It was pretty, but not easy to adjust without knowing some code. And I wholeheartedly believe that your website should be easy to use and update on the backend.
So we switched her on over to one of the templates in the Brine family - my absolute favorite for so many reasons, but one of them is the versatility and customizability.
And I went to work basically creating a new site for her in an evening. Which, at this point was super easy because we had already customized her other template, so it was all about recreating it. This time I did everything I'd done before and also:
Styled all the mobile responsive settings available in the style editor
Coded in tweaks for different screen sizes so the font-size changes depending on your screen size
Coded in two new font styles for her (h4 and h5) that included horizontal lines before and after the text (check out her About page to see what we did there)
Adjusted the buttons so that on mobile they spanned the entire width of the screen
Re-added the background colors to sections
Updated layouts for both desktop and mobile screens
Customized her blog summary page (which her other site didn't have and she was ecstatic to have it!)
Created a Style Guide page for her to easily see what each item (headers, body text, buttons, image blocks, newsletter blocks, form blocks, etc.) looks like at-a-glance
Tested it all out on my desktop, laptop, tablet, and mobile.
Now remember, we switched templates at 5pm on Tuesday. Even with the late change, she was still able to officially launch her site on Wednesday (mostly) as planned!
And I have to say - it looks amazing! And I'm so proud of Steph for finishing her site and putting it out for the world to find her. Go check it out!
SCROLL DOWN TO SEE THE SITE MOCKUP OR CLICK THE BUTTON TO SEE THE LIVE SITE
connect with Steph Asavale Photography
Website: www.stephasavale.com | Contact: www.stephasavale.com/contact
Instagram: @stephasavalephoto | Facebook: @stephasavalephoto
Want help customizing your website?