Refto
Bobbin

Bobbin

Bobbin is an AI tutoring platform from TutorCruncher that plans lessons, captures live notes, and writes parent reports so tutors spend more time teaching.

Scrolling AnimationSaasGradientEducationAiAnimationBig Background VideoClean
4.0
0
Visits
Visit

Categories

SaasEducationAi

Available Pages

Home

Version History

Design Analysis

Bobbin Home design analysis

Build a product-marketing shell that feels direct and usable for educators rather than abstract and startup-polished. Anchor the system with one hero emphasis color and then relax into calmer supporting surfaces. Keep fo...

Key Takeaways

  • Build a product-marketing shell that feels direct and usable for educators rather than abstract and startup-polished.
  • Anchor the system with one hero emphasis color and then relax into calmer supporting surfaces.
  • Keep forms and cards legible first; novelty comes second.
  • Favor product captures, tutor workflow scenes, or simple educational diagrams.
  • Use high-contrast hero framing before introducing softer downstream modules.
  • Base the shell on 0C0C0B and keep FFF7D8 as the primary reading color.

Overview

  • Build a product-marketing shell that feels direct and usable for educators rather than abstract and startup-polished.
  • Anchor the system with one hero emphasis color and then relax into calmer supporting surfaces.
  • Keep forms and cards legible first; novelty comes second.

Image Direction

  • Favor product captures, tutor workflow scenes, or simple educational diagrams.
  • Use high-contrast hero framing before introducing softer downstream modules.

Colors

  • Base the shell on 0C0C0B and keep FFF7D8 as the primary reading color.
  • Use F3E3A2 as the main emphasis color and keep it scarce enough to preserve hierarchy.
  • Let 1B1815 and 8C8273 separate secondary surfaces without introducing noisy ornament.

Typography

  • Use GT Standard as the display voice. It should read as assertive display sans.
  • Use GT Standard for body copy, controls, and supporting metadata.
  • Let scale and spacing create emphasis before adding extra font families or decorative effects.
SpacePlay/Pause←→Seek 1sShift←→Seek 10s

Related Sites