John Athayde

Product Design Player-Coach

Download as PDF

Summary

Designing and shipping for the web since 1997. A product design player-coach who still writes the code. I work the seam between design and engineering: leading discovery, shaping systems, prototyping the direction, and (when it’s the fastest way) shipping the front-end or full app to prove it.

Twenty-plus years of brand-systems-applied-to-product, treating print, marcom, web, and app UI as one coherent surface. Most of the work has been some version of this pattern: rebrand a company, apply the brand across every silo, and carry it into the product. Recent runs at PowerFleet (full company rebrand through NASDAQ relaunch during a 2x revenue, 4x headcount acquisition) and ongoing at ATI (a Driven Brands company). Earlier, I built and maintained Wilde, a packaged design system shipped as a Ruby gem and Bower package that unified 30 internal tools and Salesforce flows at LivingSocial, before “design system” was the common term.

Currently running three Rails products as the sole PM, designer, and developer (PatchVault, Rostergeek, Talos), using them as a working lab for design tokens, Lookbook, and AI-assisted design system workflows. Also: musician with a serious guitar rig, permaculture practitioner on twelve and a half rural acres in central Virginia, and a longtime Scouting volunteer.

What I do

  • Brand-to-product parity. Running brand systems across every surface a company touches (print, marcom, digital, sales, trade show, app UI) and keeping them coherent as the org changes.
  • Design systems strategy and architecture. Token systems, component libraries, the design-to-engineering distribution layer, and the documentation that keeps them honest.
  • Design and engineering bridge work. Translating product strategy into structured technical plans, and prototyping in production code when it’s the fastest path to alignment. Comfortable across Rails, React, Angular, .NET MVC, and Elixir front-ends.
  • Discovery and applied research. Service safaris, shadowing, AT-ONE, persona work, and the kind of deep listening that uncovers what the org actually needs before anyone draws a screen.
  • AI-assisted workflows. Figma to code pipelines (Tokens Studio, GitLab CI), MCP tooling, local inference, the Anthropic API, and Lookbook/Storybook as the design-system surface for AI tools to read and write against.

Experience

Owner

Meticulous, LLC

· Charlottesville, VA

Co-founder and sole operator (since 2009) of this multi-disciplinary design and Rails practice. Product design, marcom web, print, development (Rails, .NET MVC, WordPress), film, and audio production and post. Released an animated short, The Sandbox, in 2005.

Recent and active engagements:

  • ATI (a Driven Brands company), full rebrand and product arc (ongoing). Multi-year contractor engagement covering the same pattern I ran at PowerFleet: full rebrand, brand guidelines applied across marketing, print, digital, and sales silos, reskinned the existing application and shipped the implementation in .NET MVC, and currently designing new product functionality with the internal team for the next version.
  • Cybermaniacs, strategic design advisor (ongoing since August 2022). Advisory engagement working alongside the CEO on both design and broader company direction: brand evolution, website rollout review, helping manage execution work with another design contractor, auditing the software platform and proposing paths forward (including a possible Rails rebuild I’d lead), and sitting in on engineering hiring.
  • Xirgo / Elastic M2M, V3 Auto UX (6-month engagement, 2024 to 2025). Led UI refresh and design strategy for a multi-brand, multi-language, multi-device Angular-based IoT platform. Architected the design token system in Tokens Studio and built a Figma to GitLab CI pipeline to keep design and engineering in parity across white-label brand partners.
  • Procore, UX practice-building engagement (2015 to 2016). Invited in by the Head of Engineering after my RailsConf talk. Trained the org on UX discovery, helped hire the first two UX designers, designed the Change Management and Submittals modules (80+ screens and states), and established UX as a primary practice area before handing off.
  • Rails Foundation (ongoing). UX, design, and front-end work on the Rails guides (both learner and API guides) and marketing site content build-outs (case studies, foundation members, and similar).
  • AI tooling and MCP exploration. Built a series of autonomous agents (Scout, Bugle, and others) on top of the OpAgent framework, running on local inference and the Anthropic API, with integrations to HubSpot, Apollo, and Telegram. Currently experimenting with Figma Console MCP. Active in the MCP and Claude Code ecosystem for design ops, agency ops, and design-system context.
  • Other client work has included Driven Brands, Guggenheim Securities, Lifetime Networks, Ruby Central, The Academy for Educational Development, RTKL Associates, and more.

Sole PM, designer, and developer on three Rails products operated through Meticulous and Knightsbridge (the OSINT-focused research sister company):

  • PatchVault (Meticulous product). Development started 2013; in production with users since 2016. Patch design and trade documentation tooling for the Scouting community.
  • Rostergeek (Meticulous product). In rapid development; targeting public release Q3 2026.
  • Talos (Knightsbridge product). Internal use plus active client engagements; SaaS release in progress.

VP of Design

PowerFleet, Inc. (formerly I.D. Systems)

· Remote

Sole design leader through a transformative acquisition that doubled revenue and quadrupled global headcount.

  • Rebranded the company end-to-end in Oct 2019 (web, print, video, trade show, brand guidelines) and relaunched on NASDAQ.
  • Reskinned the existing React platform, writing the CSS by hand against the engineering team’s component structure, and authored brand-to-product guidelines for international subsidiaries.
  • Led reimagination of the next-generation platform: research, IA, user flows, wireframes, visual design, testing, and design system implementation.
  • Built a clickable prototype for an Intermodal Concept and a 6-minute concept video that sold the executive team on a global Connect platform refresh, which led to the PowerFleet Unity project in H1 2022.
  • Brand management and updates across all three primary brands; spin-down of older brands from pre-2019 M&A activity.
  • Sourced and managed external contractors to deliver against enterprise scope without growing headcount.

VP of Design

CargoSense, Inc.

· Remote

Sole design leader for a B2B IoT and logistics platform.

  • Ran all design and UX as a team of one: marketing materials, video/audio, web interface, mobile app interfaces, and application design and implementation.
  • Partnered with CTO and CEO on product flows for web and mobile.
  • Built and maintained a design system with engineering for the Rails, React, and Elixir platform.
  • Established and maintained brand guidelines across the company’s multiple product offerings.

Lead, Internal Tools UI/UX

LivingSocial

· Washington, DC

Led design and front-end development for the Internal Tools engineering division. Led a UX/front-end team of four as a player-coach.

  • Led the Customer Support redesign that took agent SLA from 20% to 90% and dropped call abandonment from 20% to 4%, using service safari, AT-ONE framework, and extensive shadowing of CSRs across phone and email support.
  • The design language extracted from that redesign became Wilde, a packaged design system shipped as a Ruby gem and Bower package that powered the UI of 30 internal tools and skinned Salesforce flows, maintained by a small team. Pre-term-of-art design systems work at meaningful cross-stack scale.
  • Enhanced workflows for customer support, deal quality and programming, and sales that improved metrics and KPIs across the board.

UI/UX/Design Lead

InfoEther

· Reston, VA · Acquired by LivingSocial, March 2011

Sole UX/Design resource and primary front-end developer (HTML/CSS) for a Ruby on Rails consultancy.

  • Gathered requirements from customers and turned them into designs and artifacts for engineers to build.
  • Implemented interfaces in the Ruby on Rails stack.
  • Designed print and web marketing materials for the company.
  • Worked on product development and vision for various internal products.

Partner

Hyphenated People

Ran a high-end UX and UI consultancy with Amy Hoy. Clients included Bear Stearns, Wine Library/Gary Vaynerchuk, Peracon, and Grab Networks/Voxant.

Creative Director

InPhonic Inc.

  • Built out the creative and microsites team from 4 to 15 over two years.
  • Managed 100+ jobs per month through team pipeline.
  • Directed work that improved ad performance on large media buys (MSN.com home page, others).
  • Redesigned Wirefly.com property in conjunction with EightShapes (UX).

Senior Web Developer

InPhonic Inc.

  • Created numerous microsites and marketing channels that stood outside the engineering platform.
  • Branded, built, and maintained properties, transitioning to team members after move to Creative Director.

Manager, Liquid Media Division

RTKL Associates Inc.

· Washington, DC

  • Ran procurement and project management of 3D rendering, animation, and multimedia for the DC office.
  • Coordinated with teams in LA and London for staffing and pipelines.
  • Key projects: US Capitol Visitors Center, Pentagon reconstruction (Phoenix Project), US Capitol Security Perimeter, National Trust for Historic Preservation website.

Education

Catholic University of America

Master of Architecture, January 2001

Bachelor of Science in Architecture, June 2000

Permaculture Research Institute

Permaculture Design Certificate, 2014

Publications and Speaking

  • The Rails View (Pragmatic Bookshelf, 2013). Co-authored with Bruce Williams.
  • Recent talks: Blue Ridge Ruby 2026 (permaculture principles applied to UX), RailsConf 2025 (“UX & Design for Rails Devs”), Frontrunners 2022 (“Design Systems from Zero to One,” George Mason University).
  • DeveloperUX, training curriculum for engineering teams on UX fundamentals, drawn from training the engineering orgs at Procore, LivingSocial, and others.

Outside of work

Once opened for Coldplay as a semi-professional musician. Lives with my wife and four children on our permaculture farm outside Charlottesville, Virginia. Longtime Scouting volunteer.