kaleidaweb design + maintenance

The Hard Screen

Post by Dani

On June 19, 2020
Brand, logo and site design for The Hard Screen, a women's hoops podcast created by the fabulous Tamryn Spruill. Tam wanted to keep it simple on the homepage with the most relevant podcast/article/exclusive, call-to-actions to sign up for the newsletter, and locked content that requires a subscription to THS on Patreon.
The Hard Screen
This Junteenth, I’m excited to celebrate and showcase The Hard Screen.

My web design career began in the 90s out of wanting to learn how to create a space online for a passions of mine, music, sports, tech, fighting for equality… and I finally met my person, Tamryn after following and loving her words and perspectives on these topics and where they meet race, gender and sexuality, so many years later.

Tamryn Spruill is the brilliant mastermind behind The Hard Screen, a new women’s hoops podcast. She not only creates all the content, she produces the episode and also composed the music and beats you hear. It’s all Tam and it’s amazing. She’s is a queen in women’s hoops – she’s writing a book on the history of the WNBA – and her resume includes features for The Athletic, Swish Appeal, ZORA, USA Today, and Teen Vogue and has been interviewed on NPR, Fox Sports and Bleacher Report.
Black Lives Matter
It was thanks to her work at The Athletic, I met Tam. Unfortunately (but not surprisingly considering the systemic racism and white patriarchy entrenched in society) earlier this year, Tam and twelve other women (Black women, women of Color, and Queer women) were let go from the WNBA beat, and the first ones at the publication to go. Incomes gone. Jobs lost and given to folks who have no business on those bylines. With no outlet to discuss important issues like social justice, racism, LGBTQ+, gender, misogyny and where these topics intersect with sports, most importantly from Black women’s voices like Tamryn’s who have been silenced, THS needs to exist. We need to hear her words and perspective. The WNBA is over 80% Black women, nobody needs to hear more white voices or performative allyship.

With that sentiment, it was an honor to use my tools to build an online home for The Hard Screen to thrive and grow. This site isn’t just another project, it’s love. Love for women’s hoops. Love for Black women. Love for Tamryn Spruill. Here’s how it happened.

Starting from scratch on WordPress I designed a lively landing page for THS with links to archives of all her content and podcasts. Tamryn gave me a color palette she liked and from those colors and some basketball elements, a logo, a podcast cover (with a cartoon Tam featuring her signature purple lip paint), all the web features were designed.

Flirt Shoppe    

The brick Tam chose was a super important element and drives home the “hard screen” vibe of her brand, it’s used on social media and in headers online. Close-up basketball, hardwood floor, and brick textures were used throughout the site to keep the hoops tone for visitors. The open source Bangers font worked well for the logo and font headings and Tam’s signature was used to as an additional personal touch.

Monetization and automation were important when developing this site. The site features relevant free content (the podcasts) but also exclusive paid subscriber content. THS is automated as much as possible. New podcasts and posts are pulled in from Patreon, and are easily editable in the backend in WordPress on THS. Posts on Patreon that require a live subscription are locked on The Hard Screen and visitors are encouraged to sign up for content.

Podcasts are embedded via Spotify widget and the Divi media element, so folks can listen to pods on the site, or browse to any of the other streaming services offered through Anchor.fm.

The newsletter is hooked up to Mailchimp and Patreon so folks who sign up for either will be subscribed accordingly. An embedded video element was added behind the Subscriber Exclusives section to add subtle motion to the page. Tweets are embedded on the site and links to all the podcast platforms are peppered throughout.

The site has a custom login page/admin back-end and unique design features such as a loading splash screen with the logo, custom scroll bar design, and a theme that blends into the browser on mobile devices. It was custom designed on the excellent Divi 4 theme by Elegant Themes.

Here’s a look at the design found at thehardscreen.net.

If you need a website for your voice, please contact us, we’d love to help.

The Hard Screen

A walk-through of The Hard Screen

Site tools and design features

Patreon, Spotify, MailChimp, WordPress & Divi
Flirt Shoppe

Tamryn does a lot of media, so I created a series of Zoom backgrounds for her brand.

Cartoon Tam designed for Podcast

Tamryn Spruill
Tamryn Spruill

How-to client videos

Once a client site launches, I make a few instructional videos for the team to use to edit their page content if desired. Literacy Partners are on the Essential Maintenance plan, so they have 2 free hours of maintenance work a month, they don’t need to make any edits, but if they want to make a quick change, here’s how.

This video explains how to add a blog post, perform simple updates to their pages, and import content from EventBrite to their Event Calendar.

Divi theme also has help videos built into their theme builder so there’s always an official help video wherever they’re at editing.