# Design skeleton — sophieclydesmith.com

## 1. Brand DNA

### Business
- **Name:** Sophie Clyde-Smith
- **What they do, for whom, where:** Business Coach & Mentor helping female solopreneurs launch, scale, and grow purpose-driven, profitable businesses with alignment, meaning, and financial abundance.
- **Offers:** Set It Up - Group Coaching; Step It Up - 1:1 Coaching; Workshops (1/2 day 1:1 workshop); Power Hour; Free curated email community.
- **The one action this page exists to cause:** Submit an enquiry via the contact page to start a conversation.
- **Contact and socials:** Contact page (https://sophieclydesmith.com/contact/), Instagram (@sophieclydesmith, https://www.instagram.com/sophieclydesmith/), LinkedIn.

### Brand
- **Colours:** Deep pine green `#294F48` (ground & primary brand), dusty rose `#ECD9D5` (accent), warm alabaster `#FAF8F5` (light ground), charcoal `#1F1916` (ink).
- **Fonts:** Display: Editorial high-contrast serif (Cormorant Garamond); Body: Warm contemporary sans-serif (Plus Jakarta Sans).
- **Logo:** `assets/logo.webp` (Circular wordmark: SOPHIE CLYDE-SMITH in wide-letterspaced capitals inside a hand-drawn open ring). Favicon: `assets/favicon.webp`.

### Assets
| file | subject | px | luminance | dominant colours | plain backdrop | full-bleed at 1440 |
|---|---|---|---|---|---|---|
| `assets/logo.webp` | logo | 1080x1080 | 0.531 | #fdfdfd, #030202, #605f5f | yes | no |
| `assets/portrait-desk.webp` | portrait | 6505x3172 | 0.633 | #ced1d3, #aca9a6, #19506b | no | yes |
| `assets/portrait-standing.webp` | portrait | 1734x1337 | 0.667 | #adacad, #c9ccd2, #bcc2ca | no | yes |
| `assets/work-workshop.webp` | work | 1080x1350 | 0.510 | #1f1916, #e4e0de, #996f55 | no | no |
| `assets/client-logo-allbright.webp` | client-logo | 600x600 | 0.694 | #fefefe, #1c1c1a, #5c5c5b | yes | no |
| `assets/client-logo-house-of-st-barnabas.webp` | client-logo | 512x512 | 0.935 | #fefefe, #0d0d0d, #5e5e5e | yes | no |
| `assets/client-logo-huffpost.webp` | client-logo | 1080x1080 | 0.787 | #fefefe, #020202, #626262 | yes | no |
| `assets/client-logo-jolt.webp` | client-logo | 225x225 | 0.357 | #4b3dca, #f8f8f8, #574fa9 | yes | no |
| `assets/client-logo-live-well-london.webp` | client-logo | 539x539 | 0.858 | #fcfdfd, #07161b, #08869a | yes | no |
| `assets/client-logo-sweaty-betty.webp` | client-logo | 200x200 | 0.927 | #fefdfd, #e84438, #f4a39d | yes | no |
| `assets/client-logo-the-independent.webp` | client-logo | 1080x1080 | 0.983 | #fefefe, #171614, #a3a2a1 | yes | no |
| `assets/client-logo-the-telegraph.webp` | client-logo | 500x500 | 0.865 | #fefefe, #040404, #434343 | yes | no |
| `assets/favicon.webp` | favicon | 180x180 | 0.534 | #fdfdfd, #040404, #9f9f9f | yes | no |

## 2. Art direction

- **Concept:** High-end boutique editorial mentorship balancing grounded commercial strategy with warm feminine clarity.
- **Palette:** Ground: Warm alabaster `#FAF8F5` (light sections) and Deep pine green `#294F48` (dark statement sections); Ink: Deep charcoal `#1F1916` (on light) and Warm alabaster `#FAF8F5` (on dark); Accent: Dusty rose `#ECD9D5`.
- **Type:** Display: Cormorant Garamond; Body: Plus Jakarta Sans; Typographic move: mixed weights in one line.
- **Image language:** matted.
- **Motion language:** scroll reveal, hover states, marquee. Rule: scroll reveal triggers on viewport intersection for text blocks and matted frames; hover states trigger on interactive cards, links, and buttons; marquee runs continuously in one direction for client and media logos.
- **Layout habits:** Generous editorial whitespace, side-by-side asymmetric pairings, structured multi-column card grids, and intentional ground transitions between light alabaster and deep pine green.

## 3. Story

| # | beat | job | copy | asset | seam to next |
|---|---|---|---|---|---|
| 1 | nav | Provide seamless navigation and instant brand recognition | `assets/logo.webp` wordmark, primary navigation links | `assets/logo.webp` | cut |
| 2 | hero | Position Sophie immediately as the premier business coach & mentor for female solopreneurs | Headline: "Helping Female Solopreneurs Start & Scale Purpose-Driven, Profitable Businesses." & Intro copy | `assets/portrait-desk.webp` | cut |
| 3 | press | Build authoritative third-party trust with top-tier media and client credentials | "Featured in" and "Worked with" client logos | `assets/client-logo-the-telegraph.webp`, `assets/client-logo-the-independent.webp`, `assets/client-logo-huffpost.webp`, `assets/client-logo-allbright.webp`, `assets/client-logo-sweaty-betty.webp`, `assets/client-logo-house-of-st-barnabas.webp`, `assets/client-logo-live-well-london.webp`, `assets/client-logo-jolt.webp` | ground change |
| 4 | about | Introduce Sophie's philosophy, hybrid coaching method, and personal invitation | "Hey, I'm Sophie." & Bio copy | `assets/portrait-standing.webp` | ground change |
| 5 | offer | Present clear coaching and mentoring pathways tailored to startup and established solopreneurs | "What I offer" (Set It Up, Step It Up, Workshops, Power Hour) | none | cut |
| 6 | positioning | Demonstrate real-world facilitation energy and soul-based strategic depth | "Workshops" extract & community group work | `assets/work-workshop.webp` | ground change |
| 7 | proof | Deliver deep proof and emotional validation through uncensored client transformation stories | Full client testimonials (Isobel Wilson, Claudia Criswell, Verena, Tay, Lesley, Laura Bowler, Camilla, Martina) & client roster | none | ground change |
| 8 | newsletter | Offer a low-friction entry point into Sophie's ecosystem | Free email community copy | none | cut |
| 9 | cta | Drive qualified solopreneurs to connect directly and start the conversation | Contact & booking prompt | none | ground change |
| 10 | footer | Anchor legal identity, navigation paths, and social connections | Social links, copyright, and site directory | `assets/logo.webp` | none |

## 4. Section specs

### 4.1 nav
- **Layout pattern:** hung from an edge
- **Ingredients:** Brand mark, navigation links (About, Offers, Testimonials, Contact), and primary CTA button linking to contact page.
- **Asset and tool:** `assets/logo.webp` — resize (height: 48px).
- **Motion:** hover states.
- **Copy:** "SOPHIE CLYDE-SMITH", "About", "Offers", "Testimonials", "Contact", "Get in Touch".

### 4.2 hero
- **Layout pattern:** side-by-side
- **Ingredients:** Primary headline, secondary position narrative, primary CTA button linking to contact page, secondary link to offers, matted hero portrait.
- **Asset and tool:** `assets/portrait-desk.webp` — crop (4:3) and resize (width: 900px).
- **Motion:** scroll reveal, hover states.
- **Copy:** "Helping Female Solopreneurs Start & Scale Purpose-Driven, Profitable Businesses.", "Business Coach & Mentor: helping femxle Solopreneurs to launch and grow their businesses w/ alignment, meaning & financial abundance. Whether you're in start-up mode or you're fully established, if you're looking for practical tools, tips, insights, love and support to get you to the next level in your business… You're in the right place."

### 4.3 press
- **Layout pattern:** stacked column
- **Ingredients:** Section kicker label, two continuous gliding marquee strips showcasing publication features and brand collaborations.
- **Asset and tool:** `assets/client-logo-the-telegraph.webp`, `assets/client-logo-the-independent.webp`, `assets/client-logo-huffpost.webp`, `assets/client-logo-allbright.webp`, `assets/client-logo-sweaty-betty.webp`, `assets/client-logo-house-of-st-barnabas.webp`, `assets/client-logo-live-well-london.webp`, `assets/client-logo-jolt.webp` — resize (height: 40px each).
- **Motion:** marquee.
- **Copy:** "Featured in & worked with".

### 4.4 about
- **Layout pattern:** side-by-side
- **Ingredients:** Section header, multi-paragraph bio copy, matted three-quarter standing portrait, deep pine green accent backdrop.
- **Asset and tool:** `assets/portrait-standing.webp` — crop (4:5) and resize (width: 700px).
- **Motion:** scroll reveal, hover states.
- **Copy:** "Hey, I'm Sophie.", "I'm a business coach and mentor for ambitious female solopreneurs who are ready to create more freedom, flexibility, and financial abundance through meaningful, purpose-driven businesses.", "I blend mindset coaching with actionable strategies to help you develop the confidence to take meaningful steps forward and create systems that truly work for you.", "When we work together, you'll take bold action, launch with clarity, scale with intention, and finally create the business (and life) you've been dreaming of.", "Whether you're just starting out or you're ready to take your established business to the next level, I'm here with practical tools, empowering insights, and unwavering support to help you turn your vision into reality."

### 4.5 offer
- **Layout pattern:** stacked column
- **Ingredients:** Section header, 4-card service grid detailing group coaching, 1:1 mentoring, workshops, and power hour sessions with individual enquiry links.
- **Asset and tool:** none.
- **Motion:** scroll reveal, hover states.
- **Copy:** "What I offer", "Set It Up - Group Coaching", "From business basics to money mindset, we'll cover everything you need to be ready to launch a thriving business.", "Step It Up - 1:1 Coaching", "For established female solopreneurs ready to expand their vision, grow their business and transform their mindset.", "Workshops", "1/2 day 1:1 workshop to gain clarity on your goals and develop a soul-based plan of action.", "Power Hour", "High-energy power hour to get clear on a subject of your choosing e.g. vision, goals, target audience, money mindset.", "https://sophieclydesmith.com/set-it-up-group-programme", "https://sophieclydesmith.com/step-it-up/", "https://sophieclydesmith.com/soulful-business-planning/", "https://sophieclydesmith.com/power-hour/".

### 4.6 positioning
- **Layout pattern:** side-by-side
- **Ingredients:** Matted documentary workshop photo, soul-aligned strategic narrative, workshop emphasis statement.
- **Asset and tool:** `assets/work-workshop.webp` — crop (4:5) and resize (width: 700px).
- **Motion:** scroll reveal.
- **Copy:** "Workshops", "1/2 day 1:1 workshop to gain clarity on your goals and develop a soul-based plan of action.", "When we work together, you'll take bold action, launch with clarity, scale with intention, and finally create the business (and life) you've been dreaming of."

### 4.7 proof
- **Layout pattern:** stacked column
- **Ingredients:** Section header, multi-card masonry testimonial grid featuring verbatim client quotes with full attribution and outbound links, plus client portfolio roster list.
- **Asset and tool:** none.
- **Motion:** scroll reveal, hover states.
- **Copy:** "Testimonials", Isobel Wilson testimonial, Claudia Criswell testimonial, Verena testimonial, Tay testimonial, Lesley testimonial, Laura Bowler testimonial, Camilla testimonial, Martina testimonial, "A few other people I've worked with and what we worked on together:", "Lizzie — Corporate Career Development", "Laura, Modern Professional — Career Development Coaching", "Katarina, New Mother — Career Transition Coaching", "Tay, Self-Employed Meditation and Yoga Teacher — Business Coaching", "Ruth, Lawyer — Industry Transition from Law to Travel".

### 4.8 newsletter
- **Layout pattern:** plate on ground
- **Ingredients:** Centred newsletter card, invitation heading, value proposition description, single-field email capture form with submission CTA button.
- **Asset and tool:** none.
- **Motion:** scroll reveal, hover states.
- **Copy:** "Join my email community", "Curated emails for female solopreneurs filled with inspiration, tools, and confidence to help you set up, scale, and grow your online business.", "Sign Up".

### 4.9 cta
- **Layout pattern:** stacked column
- **Ingredients:** High-impact dark-ground closing statement, primary action button directing to the contact page, secondary Instagram connection link.
- **Asset and tool:** none.
- **Motion:** scroll reveal, hover states.
- **Copy:** "Ready to get to the next level in your business?", "Get in touch and let's talk.", "https://sophieclydesmith.com/contact/", "Instagram: @sophieclydesmith", "https://www.instagram.com/sophieclydesmith/".

### 4.10 footer
- **Layout pattern:** side-by-side
- **Ingredients:** Brand mark, navigational column links, external social links (Instagram, LinkedIn), copyright and credits line.
- **Asset and tool:** `assets/logo.webp` — resize (height: 40px).
- **Motion:** hover states.
- **Copy:** "Sophie Clyde-Smith", "Business Coach & Mentor", "https://sophieclydesmith.com/contact/", "https://www.instagram.com/sophieclydesmith/", "LinkedIn", "© Sophie Clyde-Smith. All rights reserved."