Trading card game κάρτες συλλογής
Case Study #9 · Web Development

Το brand υπήρχε.
Έλειπε το σπίτι του.

One-page website και digital presence setup για το LOOT'N'MORE — κατάστημα collectibles & trading card games που πουλούσε μέσω Vendora και επικοινωνούσε μέσω TikTok, χωρίς κεντρικό σημείο αναφοράς.

Collectibles & TCG · One-pager · HTML/CSS/JS · Vendora · Παράδοση σε λιγότερο από 24 ώρες

Ένα κατάστημα με κοινότητα, χωρίς διεύθυνση.

Το LOOT'N'MORE είναι προορισμός για συλλέκτες και λάτρεις της geek κουλτούρας: Trading Card Games (Pokémon, One Piece, Magic: The Gathering, Yu-Gi-Oh!), Panini κάρτες και αυτοκόλλητα, anime φιγούρες, Kayou collectibles, Funko Pop και επιτραπέζια — με συνεχώς νέες κατηγορίες.

Οι πωλήσεις γίνονται μέσω της πλατφόρμας Vendora, ενώ η επικοινωνία με την κοινότητα κυρίως μέσω TikTok, Facebook και YouTube. Το ζητούμενο ήταν ένα σημείο που ενώνει όλα αυτά τα κανάλια σε μία ταυτότητα.

ΠελάτηςLOOT'N'MORE
ΚλάδοςCollectibles & Trading Card Games
Τύπος έργουOne-page website + digital presence setup
ΡόλοςBrand extraction, σχεδιασμός, ανάπτυξη
ΠωλήσειςVendora marketplace
StackHTML, CSS, JavaScript — single file, χωρίς εξαρτήσεις

Παρουσία σε τρία κανάλια, ταυτότητα σε κανένα.

Το LOOT'N'MORE είχε ήδη social media και shop στη Vendora — αυτό που έλειπε ήταν το κεντρικό σημείο αναφοράς.

01

Κανένα domain που να ενώνει τα κανάλια

Ο επισκέπτης έφτανε από TikTok ή Facebook και δεν είχε πού να πάει μετά — κάθε κανάλι ζούσε μόνο του.

02

Brand kit χωρίς web εφαρμογή

Υπήρχε έτοιμο brand kit με logo και παλέτα, αλλά μόνο σε PDF. Ποτέ δεν είχε μεταφραστεί σε ψηφιακό format.

03

Ασαφές τι πουλάει και πού

Από την πρώτη ματιά δεν ήταν ξεκάθαρο ούτε το εύρος των κατηγοριών ούτε ο δρόμος προς την αγορά.

Brand extraction από ένα PDF.

Ο πελάτης παρέδωσε μόνο το PDF του brand kit. Από εκεί βγήκε ολόκληρο το design system του site — χωρίς νέο branding project, χωρίς αναμονή.

  • Παλέτα. Primary #7C3AED, accent #FFC200, dark #060507, charcoal #4A4A4A, light #F6F1FD — κωδικοποιημένα σε CSS custom properties.
  • Logo. Εξαγωγή horizontal lockup και icon από το PDF σε διαφανή PNG, με white variant για dark backgrounds.
  • Typography. Exo 2 για display, Manrope για body — γεωμετρικά, με gaming energy, ευανάγνωστα σε μικρό μέγεθος.
BRAND TOKENS · LOOTNMORE.COM
7C3AED
FFC200
060507
4A4A4A
F6F1FD
Exo 2 · Display
Manrope · Body — ευανάγνωστο σε 15px και κάτω
POKÉMON · ONE PIECE · MTG · YU-GI-OH! · PANINI · KAYOU · FUNKO POP ·
ΠΗΓΗ: BRAND KIT PDFΕΞΟΔΟΣ: CSS TOKENS

Dark Collectibles — ένα site που το κοινό αναγνωρίζει ως δικό του.

Κάθε σχεδιαστική επιλογή δανείζεται από το ίδιο το προϊόν: foil, graded slabs, gaming ενέργεια.

Dark background

#060507 ώστε το μοβ και το κίτρινο του brand να «φωτίζουν» αντί να ανταγωνίζονται λευκό χώρο.

Holo-foil hover

Το signature στοιχείο: οι κάρτες κατηγοριών αντιδρούν σαν foil κάρτες — εμπνευσμένο από αυτό που πουλά το κατάστημα.

Graded slab frames

Οι φωτογραφίες προϊόντων μπαίνουν σε πλαίσια που παραπέμπουν σε βαθμολογημένες graded κάρτες.

Κίτρινο marquee

Τα brand names τρέχουν σε #FFC200 — άμεσο σήμα αναγνώρισης για κάθε TCG player.

Οκτώ sections, μία διαδρομή προς τη Vendora.

HeroΠρώτη εντύπωση, value proposition και CTA προς το Vendora shop.
MarqueeBrand awareness για τα TCG που διαθέτει το κατάστημα.
ΚατηγορίεςΈξι κάρτες με holo-foil effect — τι πουλάει, με μία ματιά.
Το κατάστημαBrand story, επιλεγμένα προϊόντα, αυθεντικότητα.
Πώς ψωνίζειςΤρία βήματα για την αγορά μέσω Vendora — αφαιρεί την αβεβαιότητα.
CTA BannerΤελευταίο push πριν ο επισκέπτης φύγει προς τα social.
Social / EmailTikTok, Facebook, YouTube και email — όλα σε ένα σημείο.
FooterLinks και Upmate credit.

Ένα αρχείο. Καμία εξάρτηση.

Χωρίς server-side code, database ή CMS — φιλοξενείται σε οποιοδήποτε shared hosting.

Single HTML file

Αυτόνομο, deploy-ready αρχείο. Ανεβαίνει και δουλεύει — χωρίς build step ή pipeline.

Base64 embedded assets

Logo, favicon και οι φωτογραφίες ενσωματωμένα — κανένα external file request.

Design token system

CSS custom properties για χρώματα, spacing, typography και transitions — ένα σημείο αλλαγής.

Mobile-first responsive

Hamburger menu, breakpoints στα 960px και 768px — το κοινό έρχεται από TikTok, δηλαδή από κινητό.

Accessibility

Semantic HTML5, skip link, ARIA landmarks, keyboard navigation, focus states, reduced-motion support.

SEO & structured data

Meta tags, Open Graph, JSON-LD Schema.org (Store), canonical URL. Scroll reveal με Intersection Observer.

Brand-accurate site, έτοιμο σε λιγότερο από 24 ώρες.

Επαγγελματικό πρόσωπο

Το κατάστημα απέκτησε κεντρικό σημείο αναφοράς που στέκει δίπλα στα social χωρίς να τα ακυρώνει.

Ένα σημείο για όλα τα κανάλια

Vendora shop, TikTok, Facebook, YouTube και email ενώνονται σε μία διεύθυνση.

Χωρίς νέες πλατφόρμες

Έτοιμο για το υπάρχον tech stack — καμία νέα συνδρομή, καμία μετανάστευση δεδομένων.

Η one-page είναι η αρχή, όχι το τέλος.

Οι φυσικές επεκτάσεις είναι ήδη χαρτογραφημένες — μπαίνουν όταν το δικαιολογεί ο όγκος.

Multi-page site

Ξεχωριστές σελίδες ανά κατηγορία: TCG, φιγούρες, board games.

Blog / community

Pull reveals, unboxings και νέες αφίξεις — περιεχόμενο που η κοινότητα ήδη καταναλώνει.

Email list

Mailchimp ή Brevo για αποκλειστικές ειδοποιήσεις νέων αφίξεων.

Analytics & Search Console

Μέτρηση επισκεψιμότητας και οργανικής απόδοσης από την πρώτη μέρα.

Custom domain email

info@lootnmore.com με επαγγελματικό mail hosting.

Ecommerce μετάβαση

Όταν η Vendora γίνει περιοριστική, το site είναι έτοιμο να δεχτεί δικό του checkout.

efantasy.gr — ecommerce σε κλίμακα

Δες το case study

Έχεις brand kit αλλά όχι site;

Δίνεις ό,τι υπάρχει — logo, παλέτα, PDF. Επιστρέφουμε ένα site που μοιάζει με το brand σου, έτοιμο για deploy.