Using glassmorphism to design The She Center's new site

View website
Year
2024
Contribution
Design
3D
3D
Intro
The She Center's mission is to revolutionize the human experience by focusing on female empowerment. I led the design of their new brand and website, and worked with two developers to bring it to life. Skills used include design, growth, 3D modeling, rendering, and video.

Why did we care?

Since I've been a member of The She Center's highest level coaching mastermind for the past four years, I was uniquely positioned to help them navigate the expansion of the brand and design their new website. It has been personally rewarding and professionally challenging to apply such wide range of skills to one project.

Step 01 Look through the branding, images, and styling that the client had started, and augment it.

Since the company's brand is being extended, not founded from scratch, I had quite a bit to go on. The logo, the title font, and the glittering gold were existing elements. I rounded it out with color, glassmorphism, bokeh, and a textual font for longer passages of text.

Step 02 Do research into other websites that also featured high-ticket coaching products.

To better facilitate the move to leadership coaching, I deeply audited and analyzed the patterns on these three websites.

  1. We Are The Women by Julie Santiago
  2. Hello Seven by Rachel Rodgers
  3. One Up Studio

Step 03 Work closely with the client to ensure the design held the conceptual significance they desired.

Similar to when I've worked on architecture projects, the conceptual underpinning for this website was critical to get right.

  • The website should be reminiscent of a physical space, as the She Center will first become a community, then perhaps a physical building, in the coming years.
  • The website should evoke a sacred space but not veer into overtly religious themes. The use of arches, light, and plaques attempt to stay true to this theme.
  • Visitors to the website should be able to see themselves in the images, as though they're looking through the arches to their future selves.

Step 04 Develop patterns and components that allow the site to grow with the company and the team.

This site needed to be built in a way to allow for components to be mixed and matched while still looking professional and gorgeous. I worked with two developers to build the site onto native WordPress and ensure all design patterns had ample flexibility for non-technical members of the team to use.

The mood board featured uncut gemstones and stained glass.
Extending the glassmorphism language.
Defining parametric rules for the arches in Rhino and Grasshopper.
Working with materials and translucence in Substance.
Common components for reviews and blog.
Components for forms and quotes.
Panoramic Concept for Case Studies
Case Studies immersive mockup
No items found.

And the tl;dr

The project is still ongoing, but we are beginning to wrap up. Key skills that I was able to bring to bear on this work have been:

  1. Working with 3D and parametric design for the arches, resulting in a lot of time saved during the rendering and lighting process.
  2. Creating an intro video, and getting more familiar with Premiere Pro and creating MOGRTS in After Effects.
  3. Making a difficult decision halfway through the web development process when it was clear that a new approach would be needed to meet the client's expected outcome.

I look forward to updating you when the project is complete.

Home
Programs
Individuals & Companies
Certifications
Keynotes
Case Studies and Reviews
Press and Partnerships
No items found.

Projects or questions?

Let's do the thing.