Eyes AI
Overview & Problem
Eyes AI is an AI-powered brand visibility platform that helps small businesses get discovered across AI search engines, social media, and traditional search. I was brought in as a second developer to resolve ongoing issues left by a previous developer and implement advanced Rive animations, custom CSS, and JavaScript interactions.
The site had accumulated errors affecting both functionality and visual accuracy. The client needed someone who could step in fast, identify what was broken, and deliver a polished result without losing momentum on the project timeline.
Process & Challenges
After auditing the existing Webflow project, I worked through issues systematically — fixing layout and structural problems first, then building the custom functionality.
The two biggest technical challenges were the Rive animations and the testimonials carousel. Webflow's native Rive element didn't render the animation files correctly due to sizing inconsistencies. I resolved this using JavaScript to control canvas dimensions and enforce the correct aspect ratio across all screen sizes.
For the testimonials carousel, the design required custom button positioning that Webflow's native slider doesn't support. I built custom styled buttons and used JavaScript to map them to Webflow's native prev/next controls — preserving slider functionality while giving full control over button placement and styling to match the Figma design exactly.
Outcome & Takeaways
All existing development errors were resolved, Rive animations rendered correctly across devices, and the custom carousel was delivered pixel-perfect to the Figma spec. The client reviewed, approved, and made payment within the 3-day project timeline.
This project reinforced what pixel-perfect development truly means in practice — not just matching dimensions, but matching intent. It also taught me that stepping into a broken codebase requires a results-focused mindset: don't get lost in what went wrong, focus on what the end state needs to be.
.png)
