Roots & Co. is a hair and scalp clinic in Cebu Business Park. I took its existing brand assets and turned them into a usable, consistent system for print, mobile information, and a live website.
The work began with a 21-page brand-guidelines document, built from the actual Illustrator and PDF source material rather than inferred from images alone. That distinction mattered: early output had introduced inaccurate brand and treatment details, so I returned to the source files, corrected the direction, and established the real logo usage, palette, typography, tone, treatments, and applications.
From there, I developed a component-based design system: reusable tokens, layout and type rules, UI components, visual reference cards, and separate applications for the marketing site and print. I used that system to direct a mobile-first online brochure for in-clinic QR use, then a live multi-page website.
I set direction throughout and served as the final verification point — catching and correcting inaccurate brand interpretations, duplicated treatment information, unsuitable clinical imagery, missing system components, and visual drift between the design and the implemented site.
I also tested the brochure and website on real devices, including an iPhone and a Huawei P30 Pro. That testing found issues automated checks did not: a large brochure bundle that would not open reliably on mobile, non-working touch sliders on Android, and a Safari-specific navigation layout issue. I worked through fixes and retested the result on device.
Scope
- 21-page brand-guidelines PDF, developed from existing brand source files
- Component-based design system: tokens, visual rules, reusable components, and marketing/print applications
- Mobile-first online brochure for QR access in clinic
- Design direction for a multi-page clinic website: Home, Treatments, treatment detail pages, Membership, About, and Contact
- Cross-browser and cross-device QA
- Content-structure and claim-safety review for treatment information
Role & collaboration
- Set the design direction, information structure, and quality bar across all workstreams
- Directed AI-assisted production and implementation; no people management claimed
- Used actual brand assets and clinical context to correct output before release
- Performed final visual checks on real hardware
Tools: Adobe Illustrator, Claude Cowork, Claude Design, Claude Code, ChatGPT, WordPress, Elementor, real-device QA on iPhone and Huawei P30 Pro
Selected campaign work
Selected work shown for portfolio purposes. Client brands and claims remain the property of their respective owners.