scribe85 Case Study | Phillip Joseph Villarreal

The Gap vs. The Solution

Traditional text editors overload the writing space with persistent toolbars, paywalls, and complex formatting setups that interrupt creative flow.

When opening conventional writing tools, writers face immediate hurdles:

Designed to honor deep concentration through zero-overhead architecture:

Ambient Focus State: UI controls fade into darkness while typing and return instantly on key triggers.
Ergonomic Container Boundary: Restricts text lines to an optimal 60–75 characters per line (CPL).
Custom Screenplay Engine: Automatic indentation and export logic for standard script layouts without fees.
Local Auto-Save: In-browser persistence ensures zero work loss without forced log-ins.

Initial architectural sketches focusing on spatial ratios, line-length constraints, and essential control placement before styling.

Simulating retro terminal ergonomics inspired by 1980s CRT displays to minimize eye fatigue during extended composition sessions.

Classic Dark Theme — High-contrast, minimal distraction interface

Balancing human-centered interaction models with low-latency client-side code.

Persona Frameworks: Designed around "The Distraction-Free Novelist" and "The Structured Screenwriter."
Typographic Hierarchy: Configured monospaced fonts (Courier Prime, JetBrains Mono) with 1.6× line-height scaling.
Lightweight UI Footprint: Custom inline vector icons and pure CSS state transitions for instant execution.

Custom Export Parser: Outputs clean RTF and TXT while preserving indented screenplay block structures down to the pixel.
Responsive Container Queries: Adapts fluidly across mobile, tablet, and ultra-wide monitor canvas sizes.
Production Pipeline: Deployed on custom apex domain via GitHub Pages with enforced SSL/TLS encryption.

Synthesizing testing sessions with authors and screenwriters into targeted UX solutions.

Feedback: Users were uncertain if the top document title was editable without visible UI cues.

Solution: Added subtle hover states, inline focus styling, and a micro-pencil icon indicator.

Feedback: Writers requested access to markdown and screenplay shortcuts without opening extra browser tabs.

Solution: Engineered a slide-out Markdown & Scripting shortcut drawer available on demand.