Skip to content

My creative journey

Design brought me here. Curiosity led me to code.

I’m Shyine, pronounced shy·in·e, a product designer and creative developer in the Greater Toronto Area, with 5+ years in product and UX/UI design and 10+ years in graphic design.

My work connects user journeys, visual design and front-end development. I enjoy turning complex ideas into clear, usable experiences, and I pay attention to accessibility, consistency and the details that help people move through a product with confidence.

Years in product & UX/UI
5+
Years in graphic design
10+
Client brands designed for
12+
OCAD University
B.DES
Software Eng., BrainStation
DIP.
Based in Toronto
GTA
Download CVGet in touch
Shyine Makin smiling and looking to the side, in a black blazer and trousers, in a softly lit office lobby.
Shyine MakinProduct Designer & Creative Developer

From graphic design to product to code

  1. 2015 – 2019

    Type, layout, colour

    A Bachelor of Design in Graphic Design at OCAD University, then a decade of visual work: campaigns, collateral, social content, program branding and photography.

  2. 2019 – 2024

    From pictures to products

    Product and UX/UI work grew out of the graphic work: Bloom in 2019, SODI in 2020, Healthper’s website and Pawships in 2021, then two years on EAMA’s field-service app. Working beside developers made me curious, and I started building applications in 2019.

  3. 2025 – 2026

    Learning to ship it

    A Software Engineering Diploma at BrainStation turned that curiosity into practice: React, Node and APIs, and sprint projects with cross-functional teams.

  4. Now

    One loop

    At Healthper I design across product, brand and campaigns, and build the design system in React that holds them together.

Why the combination matters

Design with intention. Build with imagination.

  • Less lost in handoff

    I design in tokens and components that map straight to code. Healthper’s tokens map one-to-one to Atlassian’s.

  • Feasibility, early

    Prototypes with real logic surface hard questions before a sprint is committed, like Keel’s calculations and Anchorline’s calculator.

  • Craft that survives the build

    Graphic-design training keeps typography, spacing and colour intact from the first sketch to production code.

Skills & tools

Product & UX

  • Product design
  • UX/UI design
  • Design systems & governance
  • Design tokens
  • Usability testing
  • Accessibility (WCAG 2.1 AA)
  • Prototyping
  • User flows & journeys

Visual, motion & brand

  • Visual design
  • Brand identity
  • Typography & layout
  • Motion graphics
  • Video production
  • Data visualisation
  • Executive decks
  • Photography

Front-end

  • React
  • TypeScript
  • JavaScript
  • HTML & CSS
  • SCSS
  • REST APIs
  • Node & Express
  • Git & GitHub

Strategy

  • Content design & UX writing
  • Digital marketing & SEO
  • Stakeholder workshops
  • Agile delivery
Design
Figma · FigJam · Photoshop · Illustrator · InDesign · Adobe XD · Sketch · Canva · PowerPoint
Video & motion
After Effects · Premiere Pro · Audition · CapCut
Build
VS Code · Vite · Webflow · Framer · Lottie · Rive
Work
Jira · Slack · Miro · Google Analytics 4 · Google Tag Manager · Hotjar
AI, credited where used
Claude · ChatGPT · Figma AI · Adobe Firefly · Midjourney · Cursor

Experience & education

  1. –

    Product DesignerHealthper USA, Inc.

    Lead design and development of Healthper’s company-wide design system, plus presentations, campaigns and video across product and marketing.

    • Lead @healthper/design-system: a versioned React/TypeScript component library, original icon set and documentation site, with WCAG 2.1 AA light, dark and auto modes and reduced-motion support.
    • Own its governance: ownership model, semantic-versioning releases (v2.0, v2.1) with full changelogs, and a documented contribution workflow.
    • Turn Figma prototypes into component-based React UIs with Agile engineering teams, cutting design-to-development handoff time by 25%; WCAG 2.1 audits raised Lighthouse Accessibility from 78 to 95+.
    • Design enterprise sales, data-governance and infographic presentation templates, lead multi-client presentations, and create social graphics and short-form video.
    RoleCase study →

  2. –

    Brand & Content Designer / UI EngineerFreelance (self-employed)

    Multi-client branding, campaigns and front-end builds, including CTR Inc.’s Spark Catalyst platform.

    • Spark Catalyst: brand identity, Mailchimp email campaigns and blog integration, delivered with reusable Figma component systems.
    • Design and build responsive websites and interactive publications end to end, from Figma prototypes to HTML, CSS and JavaScript, optimised for WCAG 2.1 and performance.
    ContractCase study →

  3. –

    Software Engineering DiplomaBrainStation

    HTML5, CSS3, JavaScript, React, Node, REST APIs, Git and GitHub, with industry and cross-functional sprints.

    • TD Financial Health: industry sprint building a responsive financial wellness platform associated with TD.
    • Eventure (Dec 2025 – Jan 2026): React event management app on a Node/Express API.
    • Cartogra (Oct 2025): visual-first travel inspiration web app.
    • AIgis: fraud analytics dashboard, 4-day cross-collaboration sprint.
    EducationCase study →

  4. –

    UI/UX Designer & Senior Graphic DesignerEAMA Inc. (plumbing, electrical & HVAC services)

    Owned UX/UI and end-to-end research for EAMA’s field-service SaaS platform, plus marketing creative and video.

    • Recruited and interviewed technicians, property managers and clients; ran scenario-based usability testing, remote and in-person.
    • Built a Figma design system and component library that reduced design-to-code inconsistencies by 30%, and mentored junior designers.
    • Presented concepts and pitch decks to executives; filmed, edited and mixed (Adobe Audition) employee-story and social videos.
    RoleCase study →

  5. –

    UI/UX Designer & Brand DesignerHealthper USA, Inc.

    Revamped Healthper’s website and led social media and email campaigns, driving gains in traffic, engagement and subscribers.

    • Program branding and collateral for HealthyTrim and Healthy Lungs.
    RoleCase study →

  6. –

    Graphic DesignerSpark Growth Digital Marketing Agency

    Produced 400+ social graphics and videos (campaign videos, animated data visualisations and carousels) across the agency’s own brand and 12+ client accounts.

    Role

  7. –

    UX/UI Consultant & Graphic DesignerSODI

    UI screens and graphics for a COVID-19 social-distancing app with proximity alerts.

    Contract

  8. –

    Bachelor of Design, Graphic DesignOCAD University

    Typography, layout, colour and visual storytelling: the foundation under everything since.

    Education

Certifications

  • Introduction to Web Development · UC Davis (Coursera)
  • Accessible Web Development · Coursera, Aug 2023
  • Front End Development with ReactJS · Coursera, Feb 2023
  • Get Started with Figma · Coursera, Feb 2023
  • LinkedIn Learning · 10 courses, including Agile, UX & AI and Digital Marketing

Ice breakers

  • Coffee or tea?

    A good cup of coffee to kickstart creativity.

  • Favourite design tool

    Figma. I can’t live without it.

  • Dream project

    Something that combines AI with user experience design.

  • Hidden talent

    Picking up new design software quickly.

Fun fact #1

Adaptable like clay

My experience spans administration, telecommunications, marketing coordination, graphic design and UX/UI. That range taught me to adapt, and to keep improving in any role.

Fun fact #2

Balancing calm and coffee

Meditation and yoga keep me calm and focused. University taught me to meet deadlines, and I like finishing ahead of time so the team stays stress-free. Outside work I share ideas on design, beauty and personal growth through Shine Exclusively and Shine Eleganza.