●Gyros · Souvlaki · Horeca●
Since 1977
in meat.
Project overview
NANOS GYROS & MEAT GROUP
NANOS Gyros & Meat Group is one of Greece’s largest gyros and meat producers for HoReCa. The project goal was a modern group presence — easy navigation across products and services, a clear corporate image, and an experience combining utility, aesthetics and strategic communication.
In partnership with
Design & build
Content architecture
The site architecture was planned around complex information: a multi-section homepage, product catalogue by category, company, distribution, certifications and news. Each area is its own component so users can reach everything quickly — in Greek and English.
Design approach
The layout balances brand longevity with a modern industrial aesthetic. The palette — burgundy and dark surfaces on the homepage, light stone on product pages — shifts dynamically to reinforce trust without losing the complexity of the group’s operations. Roboto Slab typography, meat illustrations and quality badges tie into the corporate identity.
Motion & responsive
Motion is used subtly across sections and reveals to create flow without overload. Every element is fully responsive. Stack: Next.js App Router, React, Tailwind — CMS-driven hero with fallback, Cloudinary images, lazy loading below the fold.
Stack
Core components
Hero carousel
Dynamic CMS slides
with static fallback.
Features marquee
Animated presentation of
key brand elements.
Lazy sections
Below-the-fold loading
for a fast first paint.
Hero carousel
Dynamic CMS slides
with static fallback.
Features marquee
Animated presentation of
key brand elements.
Lazy sections
Below-the-fold loading
for a fast first paint.
Product grids
Catalogue by category
with a shared template.
Scroll reveals
Subtle motion
without overwhelming the user.
Navbar zones
Light / dark states
and language switching.
Admin panel
Hero & news
without code changes.
Hero carousel
Dynamic CMS slides
with static fallback.
Features marquee
Animated presentation of
key brand elements.
Lazy sections
Below-the-fold loading
for a fast first paint.
Product grids
Catalogue by category
with a shared template.
Scroll reveals
Subtle motion
without overwhelming the user.
Navbar zones
Light / dark states
and language switching.
Admin panel
Hero & news
without code changes.
The website architecture was carefully planned,
taking into account the complex structure of the content.
From the grill house, burger spot and supermarket next door,
to traders across Greece
and Europe, guarantees:
TOP QUALITY–SAFETY–SERVICE
Chicken Gyros
Pork Gyros
Chicken Souvlaki
Pork Souvlaki
Mixed Burger Patty
Chicken Strips
Challenge
The group needed a digital presence that made products and services easy to discover — not a generic food template — with a structure that could support dozens of pages and bilingual navigation.
Solution
A website designed with careful content architecture, brand-tuned UI/UX, and a Next.js implementation: component-based structure, subtle motion, and an admin for ongoing updates.
Results
A clean, modern experience that reinforces NANOS’ reliability — easy navigation on every device and a foundation for new categories and markets.
Deliverables
- Website design & UI / UX
- Content architecture (EL / EN)
- Homepage — hero, features, products, quality, precooked, network
- Product catalogue by category
- Company, distribution, certifications, FAQ, news
- Admin for hero slides and articles
- Live production site