Seenry
Building Seenry
Design references for you and your AI. Seenry is my main focus.
Ian Gabriel Agujitas
I'm currently building Seenry. It’s my current independent product: a design reference library for people and the AI agents they build with.
Seenry brings together website screens, app flows, branding, decks, and motion. The library gives you material to study, while Seenry MCP brings those references into an agent's workflow. The companion Seenry Skills give that research a practical process: study, build, critique, and refine.
What I’m building
The project spans a React library interface, a Cloudflare D1 catalog, media delivery through R2, and a read-only MCP connection for agents. The companion skills make the workflow available as an installable package.
The central design decision is to retain the context around a reference: a screen, its place in a flow, and the available evidence behind it. A still image can show composition; a recording can show behavior. They answer different questions.
Design process
The starting question: how can someone find a useful reference, understand it, and bring it into their own work? The diagrams reconstruct decisions from the project’s design notes; they are not original sketches.
Start with the skeleton
Each section gets one job: introduce the collection, show real material, then connect it to a workflow.
The design notes compared product-first, flow-first, and build-first directions. Product-first represented Seenry’s range best. Flow-first overemphasized apps; build-first introduced agent setup before explaining the library.
Set the layout and spacing
The documented direction used an 1184px content width, with consistent 24px mobile insets in its review. Shared edges make the sections read as one system.
Tighter gaps connect a heading to its explanation. Larger gaps signal a new task. The neutral surface leaves color to the references, while type size and contrast establish the reading order.
Why the opening carousel?
The opening needs to show breadth without becoming the full library. A horizontal strip introduces different kinds of work in a compact band.
A grid supports comparison; the carousel introduces variety. The cost is that some items remain outside the visible area and small, angled previews are harder to study. The implementation notes describe preserving image proportions, fixing mobile clipping, and retaining a still composition for reduced motion.
Add motion after the structure works
The project explored an elastic, wheel-controlled carousel but did not ship it: distortion obscured UI details and the wheel behavior replaced normal scrolling. The lower story instead used a reversible reveal with native scrolling.
A switchable workbench also kept one real example readable. Side-by-side evidence cards made examples too small; repeated stacked studies added too much framing.
Check the result
The documented review covered desktop and narrow layouts, alignment, loading, image proportions, and reduced motion. These checks establish whether the interface holds together—not whether people find useful references faster. That remains a question for real usage.
From study to build
The skills are the other half of Seenry. They turn references into a brief, a layout system, several compositions, and a review of the rendered result. I keep the library and the process connected because finding good work is only the start; the useful part is understanding it well enough to make decisions in your own project.
