Site Showcase: Sophie Timothy Photography


Designer's Name: Amber Ladd

Email Address:

Your Studio Name (if applicable): Amber Ladd Studio

Your Site URL:

Client's Site Name:: Sophie Timothy Photography

URL of Page you Want Featured if you are not submitting your own images:

Client Site Description: Photography Portfolio

Template Chosen: Rally

Why did you choose that template?: I always begin my Squarespace sites with Rally, or another from the Brine family. I find this collection of templates to be the most versatile for implementing a custom design and creating a unique website.

What was the Client's Objective?: To create an online home that was consistent with the new branding – refined, authentic, and easy to navigate with strong call-to-action sections.

Tell us a bit about the design process?: We began by collaborating on a Pinterest board which we refined down to a moodboard of 12 core images that set the tone and style for the brand. Once branding was complete, we discussed in person and via a questionnaire exactly what the client wanted to achieve with the new website and I set about strategically creating a home page mockup and sitemap that reflected both her visual aesthetic and user experience goals. Once the home page was signed off, I began developing it on Squarespace before branching out to complete the remaining pages on the site.

How did you help the client differentiate their business through design?: Originally, the client's website was a standard template selected from the Portfolio template section on Squarespace. It was similar to what most DIY'ers websites look like – white, template-y, built-in fonts. Sadly, it didn't stand out in the huge market of other creatives online. Through design, we have now set the client's business apart with a look that is refined, authentic and high-end. She now has the confidence to raise her prices – even though her portfolio content is the same, she now has a strong brand look and feel behind her.

Is there custom development? What about custom added CSS? Can you tell us why you did or did not use these edits?: There is custom development that has been added to this website. I wanted to create a website that was unique to my client and that didn't feel like the standard Squarespace template she had previously. I added over 1000 lines of custom CSS to the website to give it a full visual makeover that couldn't have been achieved via the built-in Style Editor alone. I really enjoy developing on Squarespace and pushing the boundaries of the template; I always try to add in custom code as a way to challenge myself and also deliver my clients with something beyond what they often believe Squarespace is capable of.

What are the top three creative features you used in the design?: 1. On the homepage, the client wanted a full height slideshow banner with text/imagery overlaid on top. I achieved this by adding a normal Slideshow Gallery block to an index section, then using CSS proceeded to remove all padding from the section and make it full screen height. Then, using CSS again, I was able to code the her tagline image to be front and center on top of the slideshow.

2. I wanted to make some fancy button styles on the website so opted for using some unicode arrow symbols on the Call to Action sections. I also added a circle border around each symbol to make it stand out more. This could have been achieved by using a custom icon, however I was eager to do it this way for something different. I also added these to sections such as the home page which were built from galleries and text was inserted via the caption. Not a simple task given the text editing options in those sections is very basic!

3. On the mobile version of the website, I was able to customise the built-in Mobile Information Bar to remain on-screen at all times as well as force the standard "Email" call to action to say something custom. I used this as an opportunity to say "Book Now" and link to the contact page instead of an email address.

Anything else you want us to know about the site?:

Vendors used?: Copywriter: Christina from Uh Huh Digital


Brine TemplateMeg S.Comment