Add animated Terraphim AI logo with p5.js mandala visualization#577
Open
AlexMikhalev wants to merge 3 commits intomainfrom
Open
Add animated Terraphim AI logo with p5.js mandala visualization#577AlexMikhalev wants to merge 3 commits intomainfrom
AlexMikhalev wants to merge 3 commits intomainfrom
Conversation
Create a Mathober Day 10-inspired animated logo with stellated polygon mandala patterns in Terraphim's orange/gold color palette. The animation features radial grids, rotating stellated polygons, an inverted triangle frame matching the brand symbol, and a subtle T letterform at center. - Add standalone logo animation page at /logo-animation/ - Embed animated logo on homepage replacing static avatar - Add static logo image to navbar brand https://claude.ai/code/session_01XTUNKF2rvdse4VHgZP5KyS
Replace the p5.js iframe embed on the homepage with a pure SVG animated logo. The SVG uses CSS keyframe animations for rotating stellated polygon layers, a breathing inverted triangle frame, and a pulsing T letterform - all in Terraphim orange/gold palette. Zero JS dependencies, ~6KB file. The interactive p5.js version remains at /logo-animation/ as a standalone experience for visitors who want the full Mathober Day 10 mandala effect. https://claude.ai/code/session_01XTUNKF2rvdse4VHgZP5KyS
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR introduces an animated logo for Terraphim AI featuring a stellated polygon mandala design. The animation is built with p5.js and integrates into the website homepage and navigation.
Key Changes
New animated logo visualization (
website/static/logo-animation/sketch.js):Logo display pages:
index.html: Full-page standalone logo viewer with branding text and subtitleembed.html: Minimal embed-friendly version for iframe integrationWebsite integration:
website/templates/index.htmlto replace static avatar with embedded animated logo iframewebsite/templates/base.htmlto add Terraphim logo to navigation barImplementation Details
windowResized()handler for canvas scalinghttps://claude.ai/code/session_01XTUNKF2rvdse4VHgZP5KyS