BorelCorp.com

Client Project for Kathryn Borel

Status: Live URL: borelcorp.com

Overview

BorelCorp.com is a creative web project built for Kathryn Borela deliberately retro 1990s-styled corporate website for a fictional international trade and logistics company. The site blends authentic period web design with whimsical storytelling, creating an immersive experience that operates “at the intersection of commerce and culture.”

The Concept

BorelCorp International presents itself as a global trading house established in Thunder Bay, Canada in 1987. The company claims to operate across 47 countries, moving “both materials and meaning” through specialty goods import/export and unconventional business services.

The Fiction:

  • Established 1987 in Thunder Bay
  • “Global trading house for distinctive goods, emerging markets, and ideas in motion”
  • Operates divisions like “Conceptual Logistics Dept.” and “Applied Trade Operations”
  • Features products like ResMod and the TAROT Project
  • Deliberately anachronistic timestamp (April 1997)

Design Philosophy

Authentic 1990s Aesthetic

The site recreates the look and feel of late-90s corporate websites with meticulous attention to period-appropriate design:

Visual Elements:

  • IBM-style top navigation bar
  • Classic blue sidebar navigation (#6699cc)
  • Gradient hero sections
  • Traditional hyperlink colors (blue/purple visited states)
  • Simple table-based layouts
  • Netscape-era typography choices

Technical Approach:

  • CSS-only layout - No JavaScript dependency
  • Semantic HTML - Clean, accessible markup
  • Responsive design - Works on mobile while maintaining retro sensibility
  • Performance-first - Lightweight, fast loading

Breaking the Fourth Wall (Subtly)

The site walks a careful line between corporate legitimacy and creative absurdism:

  • TAROT Project: “Merging data science, archetypal intelligence, and the magick of forecasting”
  • Conceptual Logistics: A department that sounds official but hints at something more abstract
  • “Ideas in Motion”: Corporate speak with philosophical undertones

Key Features

Content Sections

Company Information:

  • About page with (fictional) company history
  • Division descriptions (Conceptual Logistics, Applied Trade Operations)
  • Contact and wholesale partnership inquiries

Products & Services:

  • ResMod: Product with version updates and release notes
  • TAROT Project: Forecasting and planning platform (the public-facing lore)
  • Gritty Tarot: The actual Tarot deck - custom artwork by Kathryn Borel displayed at borelcorp.com/gritty
  • News headlines announcing developments
  • Service descriptions spanning 47 countries

Design Features:

  • Retro navigation patterns
  • Period-appropriate color schemes
  • Classic corporate copywriting style
  • Authentic 90s web conventions

Technical Implementation

Frontend

Public-Facing Site:

  • Static HTML/CSS for most pages
  • No JavaScript frameworks for main site
  • Responsive CSS Grid/Flexbox (modern tech with retro appearance)
  • Custom fonts and styling
  • Optimized for modern browsers while appearing vintage

Backend: The Real Functionality

While the site appears to be a simple static corporate website, the actual technical innovation is hidden: a custom CMS for managing the Gritty Tarot deck.

Gritty Tarot Card Management System:

  • Hidden admin page - Password-protected CMS interface
  • Card upload functionality - Kathryn can upload drawings of Tarot cards
  • Card association - Link uploaded artwork to specific Tarot cards
  • Public display - Cards display on borelcorp.com/gritty
  • Dynamic content - Backend-driven card gallery within static-looking site

Technology Stack:

  • [Add backend framework/language]
  • [Add database solution]
  • [Add image storage/CDN]
  • [Add authentication system]
  • Admin interface design (retro-styled to match site aesthetic?)

Architecture:

  • Most pages: Static HTML/CSS (fast, simple, retro)
  • /gritty page: Dynamic, database-driven card gallery
  • Admin interface: Full CRUD functionality for card management
  • Seamless integration that maintains 90s aesthetic

Hosting & Deployment:

  • Custom domain (borelcorp.com)
  • [Add hosting provider]
  • [Add deployment process]
  • Static assets + dynamic backend

Creative Direction

The BorelCorp Universe

The project creates a fully realized fictional company with:

  • Consistent branding: Logo, color scheme, corporate voice
  • Product ecosystem: Multiple offerings with detailed descriptions
  • Company culture: Hints at a unique organizational philosophy
  • Historical narrative: Origin story from Thunder Bay transport origins

Kayfabe Commitment

The site maintains the fiction without winking too hard at the audience. It’s presented as a legitimate corporate site, allowing visitors to discover the creative elements organically rather than breaking character with obvious satire.

The Gritty Tarot: Art Meets Functionality

The centerpiece of BorelCorp’s actual functionality is the Gritty Tarot - a custom Tarot deck illustrated by Kathryn Borel.

The Public Experience: Visitors to borelcorp.com/gritty encounter what appears to be a product page within the retro corporate site. The page displays the Gritty Tarot deck, presenting Kathryn’s artwork in a gallery format that maintains the 90s aesthetic.

The Hidden CMS: Behind the scenes, a password-protected admin interface allows Kathryn to:

  • Upload new Tarot card illustrations
  • Associate drawings with specific cards (The Fool, The Magician, etc.)
  • Edit card metadata and descriptions
  • Manage the deck as it evolves
  • Publish/unpublish cards

Why This Matters: The project isn’t just a static art portfolio—it’s a living creative platform. Kathryn can continue adding to and refining the Gritty Tarot over time without needing developer intervention. The admin CMS empowers her to manage her own artwork within the fictional BorelCorp framework.

Design Philosophy: Even the admin interface (likely) maintains the retro aesthetic, so the experience feels cohesive whether you’re a visitor viewing the cards or Kathryn managing them. The whole site exists in the BorelCorp universe.

Development Process

Design Decisions

Why 1990s?

  • Nostalgia appeal and aesthetic distance
  • Pre-dot-com-bubble corporate optimism
  • Period when corporate sites were earnest but unsophisticated
  • Allows for creative absurdism within corporate conventions

Color Palette:

  • Primary blue: 6699cc (classic “web blue”)
  • Navigation and accent colors inspired by IBM, Microsoft, early corporate sites
  • Understated, professional, period-appropriate

Typography:

  • System fonts that evoke the era
  • Clear hierarchy
  • Readable body copy with 90s spacing

Challenges & Solutions

Modern Responsive + Retro Look:

  • Challenge: 90s sites weren’t responsive
  • Solution: Use modern CSS techniques while maintaining period-accurate appearance
  • Mobile layout feels like a “mobile version” from that era

Authenticity Without Kitsch:

  • Challenge: Avoiding parody or obvious satire
  • Solution: Commit to the fiction, write genuine corporate copy
  • Let the absurdist elements (TAROT, “archetypal intelligence”) emerge naturally

Maintaining Kayfabe:

  • Challenge: When to reveal it’s fiction vs. playing it straight
  • Solution: Keep the main site in character; behind-the-scenes details reserved for this documentation

Future Enhancements

Potential additions or updates:

  1. Expanded product lines: More ResMod versions, new TAROT features
  2. News archive: Build out historical announcements
  3. Employee directory: Add fictional staff profiles
  4. Case studies: Client success stories in the BorelCorp universe
  5. Download center: Period-appropriate PDFs, whitepapers
  6. Contact form: With deliberately outdated form design
  7. Web 1.0 Easter eggs: Hidden pages, guestbook, hit counter

Lessons Learned

Design Insights

  • Constraints inspire creativity: Limiting to 90s techniques forced creative solutions
  • Authenticity matters: Subtle period details make the experience more immersive
  • Less is more: Simple HTML/CSS can be powerful and performant
  • Typography and spacing: Small details define an era

Creative Process

  • Commit to the bit: Maintaining kayfabe creates a richer experience
  • Balance fiction and function: The site works as both art project and functional website
  • Details matter: Small touches (timestamps, department names) build the world
  • Write real copy: Even fictional companies need genuine-sounding corporate voice

Technical Insights

  • Hide the complexity: The CMS is invisible to public visitors—they just see the Tarot deck
  • Empower the creator: Give the artist/client control without requiring code knowledge
  • Blend static and dynamic: Most pages can be simple HTML while key features use backend
  • Aesthetic consistency: Even admin tools should feel like they belong in the universe

Part of Client Solutions