Axiom STEM - Motion Designer | ContraWork by Axiom STEM
Axiom STEM

Axiom STEM

Web Design, UI/UX & Development Studio

New to Contra

Axiom is building their profile!

Followed by GALLERY L
Cover image for KINETIQ: a website for a
KINETIQ: a website for a fitness club and physiotherapy centre šŸ’Ŗ A modern, high-energy website for a fictional fitness club and physiotherapy centre, KINETIQ. It's built around one message: "Strength Meets Recovery." The goal: show how a wellness brand can look both powerful and clinical, and turn visitors into booked assessments. What I designed and built: ✦ Cinematic hero: a dark, moody video-style hero with a bold gradient headline, a clear "Book an Assessment" button and a row of key stats ✦ Animated counters: the numbers count up as they come into view, built with Anime.js ✦ Smooth motion throughout: page transitions, scroll reveals and animated borders built with Framer Motion ✦ Complete multi-page site: Home, About, Services, Portfolio, Team, Reviews and Contact, with dropdown navigation and a side drawer menu ✦ Conversion-focused layout: "Book Appointment" is always visible in the header, and each section guides visitors toward booking ✦ Responsive on every device, with a dark theme and neon-green accent for a sporty, premium feel My role: concept, UI/UX design, motion design and front-end development. Built with: React, Vite, Tailwind CSS, Framer Motion and Anime.js. šŸ”— Live site: https://kinetiq.axiom-stem.com Need a website that makes people want to book? Let's talk.
0
25
Cover image for Helios: cinematic website for a
Helios: cinematic website for a solar-energy company ā˜€ļø A bold, cinematic website for a fictional solar-energy brand, Helios. It's designed to make a technical product feel exciting and easy to understand. The goal: show how a clean-energy company can stand out from generic corporate sites by using film-style motion, rich visuals and confident typography. What I designed and built: ✦ Cinematic hero: a full-screen background video of solar installations, with a dark gradient overlay and a bold gradient headline, "Harness the Future of Infinite Energy" ✦ Scroll-driven motion: the hero stays pinned in place while the captions and visuals change as you scroll ✦ Smooth scrolling: a buttery, inertia-style scroll across the whole site ✦ Motion graphics sections: split-scroll panels, a day-to-night energy transition, an animated gallery and kinetic text ✦ Complete multi-page site: Solutions, Technology, Projects, Impact, Gallery and Contact pages, with a quick-access side rail and a mobile menu ✦ Accessibility and performance: a still poster image replaces the video for visitors who prefer reduced motion My role: concept, UI/UX design, motion design and front-end development. Built with: React, Vite, Tailwind CSS, GSAP (ScrollTrigger animation) and Lenis (smooth scrolling). šŸ”— Live site: https://helios.axiom-stem.com Want a website that moves like a film? Let's talk.
0
21
Cover image for Northwood Academy: one school, two
Northwood Academy: one school, two experiences šŸ« A school website that speaks to two different audiences. The Senior School and the Junior School each get their own interface and colour theme, so every visitor feels the site was made for them. The goal: present the school's programmes, campuses and admissions in a polished, easy-to-follow way that builds trust at first glance. What I designed and built: ✦ Senior School interface: a refined, mature look with a cinematic homepage and scroll-driven animation ✦ Junior School interface: a brighter, more playful design in its own colour theme, with a dedicated interactive layout ✦ Two distinct colour themes that clearly separate the Senior and Junior sections while staying part of one brand ✦ Clear navigation for academics, admissions and campus information ✦ A fully responsive design for phones, tablets and desktops My role: UI/UX design and full front-end development, from concept to live site. Built with: Next.js, React, Tailwind CSS and GSAP. šŸ”— Live site: Northwood Academy: one school, two experiences šŸ« A school website that speaks to two different audiences. The Senior School and the Junior School each get their own interface and colour theme, so every visitor feels the site was made for them. The goal: present the school's programmes, campuses and admissions in a polished, easy-to-follow way that builds trust at first glance. What I designed and built: ✦ Senior School interface: a refined, mature look with a cinematic homepage and scroll-driven animation ✦ Junior School interface: a brighter, more playful design in its own colour theme, with a dedicated interactive layout ✦ Two distinct colour themes that clearly separate the Senior and Junior sections while staying part of one brand ✦ Clear navigation for academics, admissions and campus information ✦ A fully responsive design for phones, tablets and desktops My role: UI/UX design and full front-end development, from concept to live site. Built with: Next.js, React, Tailwind CSS and GSAP. šŸ”— Live site: https://northwood.axiom-stem.com Need a website that serves more than one audience, without looking like a template? Let's talk. Need a website that serves more than one audience, without looking like a template? Let's talk.
3
1
68
Cover image for Selected web design & development
Selected web design & development work from Axiom STEM. 🌐 Four sites, four industries, one approach: clean, conversion-focused design with smooth, purposeful motion and fast, responsive builds. ⚔ Energy & technology: a bold, dark interface that makes a complex product feel clear 🄭 Fresh produce e-commerce: appetizing visuals, easy category browsing and a simple path to ordering šŸ« Education: a warm, trustworthy school site with clear navigation for parents and students Everything is designed in UI/UX and built as custom code, not templates. Need a website that looks sharp and works hard for your business? Let's talk. šŸ‘‡
0
33