A Tailored Web Solution for ZATAP’s Growing Needs
We developed a custom WordPress platform to help ZATAP manage their content easily, enhance user experience, and support their product authentication goals.
ZATAP, a product authentication platform, needed a custom web solution to improve their online presence and support their content needs. We brought their vision to life by creating a responsive and dynamic website based on Figma designs for desktop, tablet, and mobile devices. We focused on building a tailored admin area that would allow ZATAP to easily manage content, create new pages, and support their growth.
Zurich, Switzerland
Business/Productivity Software
6 weeks
Web development
WordPress Development, Timber & Bedrock, GSAP, JavaScript, HTML, SCSS, PHP
Challenges & Objective
ZATAP wanted a flexible and custom website that matched their brand and was easy to update. The designs contained different components with slight variations. The challenge was to build reusable and customizable content blocks that kept the admin area simple and easy to use. Our goal was to create a tailored web experience that looked great and was efficient to manage.
Our Approach
Understanding the Vision
We started by diving deep into ZATAP’s vision. We reviewed the designs for desktop, tablet, and mobile, taking time to understand every detail. Our goal was to create a tailored web solution that felt right for ZATAP and their users.
Planning for Flexibility
Next, we explored which default Gutenberg blocks could be reused and which custom blocks were needed. The idea was to build something simple yet flexible. We planned 20 custom content blocks that ZATAP could use in different ways without making the admin area complicated. This way, they could easily update content and create new pages.
Creating a Consistent Look
With a clear plan in place, we moved on to design. We created a style guide—covering colors, fonts, buttons, and image sizes—to make sure the site had a consistent look. We then used the Zimber framework and Roots Bedrock to build the theme, giving ZATAP a smooth and custom web experience.
Building Custom Blocks and Animations
This was where the fun began. We developed custom blocks that could be used across the website, making it easy to manage content. For a unique touch, we built a reveal slider using GSAP animations. As users scroll down, new slides appear smoothly, creating an interactive experience. We also added scroll-triggered fly-in sections, making the site feel dynamic as elements slide up into view while scrolling.
Reviewing and Launching the Site
Once the blocks and animations were in place, our QA team reviewed every detail. We made sure the site worked seamlessly on all devices and that it matched ZATAP’s design and needs. After gathering feedback from ZATAP and making final tweaks, we launched a custom web solution that enhanced their online presence.
Co-Founder
Key Features
Reveal Slider with GSAP Animations
A scroll-based slider that reveals new slides as users scroll through the page. Using GSAP, we created smooth animations that add a unique touch to the design and engage users effectively.
Scroll-Triggered Fly-In Sections
The homepage includes special sections where elements, like a phone mock-up, slide up into view as users scroll. These smooth animations, powered by GSAP, help connect text and images, making the content more lively and interactive.
SEO & LCP Optimization
We focused on improving the site’s performance, especially the LCP (Largest Contentful Paint), to make sure the site loads quickly on both desktop and mobile. These improvements helped with SEO and made the site experience smoother for visitors.
Custom Content Blocks
We created 20 adaptable content blocks based on the design, making sure they were flexible and easy to use. This made it simple for ZATAP to create pages and manage content without a cluttered admin area.
Careers Page
We built a dedicated page for job postings, allowing applicants to send their resumes directly through the site. Applications are automatically forwarded to the client’s email, making the hiring process simple and efficient.
Outcome
Delivered a tailored web solution for a strong online presence.
Made content management easy for quick updates.
Enhanced Mobile Experience for users on all devices.
Responsive Design that looks great on desktop, tablet, and mobile.
User-Friendly Admin Area for quick and easy site management.
Scalable Foundation to support future growth and content needs.
Want a Website That Works for Your Business?
More Success Stories
