Design av en museiapp
Dussintals UI-riktningar. En klickbar prototyp.
49
varianter av startskärmen
30+
designade skärmar
5
berättarlägen
dagar
inte veckor
Det vi satte oss för att bygga
Vi gjorde om briefen till en fungerande produkt i ett enda designsystem. Kunden kunde klicka sig igenom Museo, jämföra riktningar och bestämma sig snabbt, långt innan utvecklingen startade.
Ett återanvändbart ramverk för presentation
Ett AI-drivet system visade appen i en realistisk iPhone-mockup, i en levande varumärkesbok och i ett rutnät av varianter, så att varje ny idé direkt hittade sin plats.
49 riktningar för startskärmen, snabbt
I stället för en säker startskärm genererade vi 49 varianter och testade layout, hierarki och känsla innan vi bestämde oss.
Hela flödet, klickbart
Skanna → känn igen → berättelse, onboarding, detaljer om konstverket, profil, premium. En riktig interaktiv prototyp, inte lösryckta, statiska skärmar.
En levande varumärkesbok
Designsystemet Dark-Luxury (obsidian + koppar) dokumenterades som levande UI: färger, typografi, knappar och formulärfält var desamma på varje skärm.
Beslut på timmar
De inblandade jämförde riktiga riktningar sida vid sida och godkände en väg på några timmar. Veckor av mockup-rundor blev ett enda möte.
Direkt till utveckling
Den validerade prototypen blev specifikationen för Flutter-appen i produktion, så design och kod gled aldrig isär.
Startskärmen - 49 varianter med AI
Det här är riktiga, interaktiva skärmar från prototypen, inte mockuper. Scrolla i panelen och se riktningarna vi genererade med AI.
14 av 49 varianter av startskärmen - live och interaktiva · 1/3
Skanningsgränssnittet
Från att du lyfter kameran till att du hör berättelsen: kärnflödet, prototypat från början till slut. Nedan ser du riktiga, interaktiva skärmar.
16 varianter av skanningsflödet - live och interaktiva · 1/4
Ljudspelaren
Animerade berättarskärmar med rika bakgrunder byggda kring konstverket. Ögonblicket då historien faktiskt spelas upp.
15 varianter av ljudspelaren - live och interaktiva · 1/3
The Night Watch
...into the shadows of the background.
Notice how the light falls not from a single source, but seems to emanate from the figures themselves.
This technique, known as chiaroscuro, was mastered by Rembrandt...
Expert Commentary
Rembrandt's Light
The Night Watch
Tap anywhere to hide controls
The Night Watch
Premium och betalvägg
Ögonblicket för uppgradering: priser, fördelar och betalväggen för abonnemanget, prototypat i sin helhet.
15 varianter av premium / betalvägg - live och interaktiva · 1/3
Join the Patrons
Unlock the full Museo experience
ALEX MILLER
ID: 884-291-PATRON
Recurring billing. Cancel anytime.
LIMITED
See What You're Missing
Unlock The Hidden Layer
HD Zoom
Expert Audio
Manifesto
Art is not just
to be seen.
It is to be
understood.
Museo Premium isn't just a set of features. It is a commitment to the preservation of stories that define our humanity.
Become a Patron today and ensure that no masterpiece goes unheard.
Upgrade Plan
Unlimited
Visual Recognition
Identify unlimited artworks instantly.
Audio Guides
Curator narrations
Offline
Save for later
Support the Arts
Your sub funds museum digitization
Unlock Infinity
Experience art without boundaries. Deep zoom, expert narratives, and exclusive access.
Resten av appen
Onboarding, inloggning, detaljer om konstverket, profil och mer. Hela upplevelsen designad som ett system.
9 av 30+ skärmar - live och interaktiva · 1/2
Hear the story.
Every artwork has a story waiting to be heard.
Profile
Art Lover
Member since Nov 2025
24
Favourites
156
Scanned
Quick Actions
Brand Ambassador
Brand Ambassador Mode
Help museums by documenting artworks
Narration Style
Select how you'd like to experience art
Special Modes
Favourites
Levande varumärkesbok
Dark Luxury i varje detalj
Obsidian
#1a1a1a
Bakgrund
Yta
#121212
Kort
Kantlinje
#2A2A2A
Avdelare
Koppar / Champagne
#eac0a2
Accent · CTA
Mörk koppar
#b89780
Hover · gradient
Skiffer
#8E8E93
Sekundär text
Rubriker · serif
Museo
Brödtext · sans
En lugn, sofistikerad premiumröst: Playfair Display i rubrikerna, Inter i gränssnittet.
5 berättarlägen
Klassisk och Express är gratis, medan Expert, WCAG och För barn är premium. Vart och ett är ett nytt sätt att höra samma konstverk.
Och logotypen
Vi designade Museos ordmärke och symbol för att passa in i världen av koppar på obsidian.
Utanför appen
Vi designade trycksakerna också
Affischer och flygblad i samma Dark-Luxury-språk: en QR-kod direkt till appen och ett löfte: Scan. Listen. Discover.
Design av museiapp - FAQ
Vad kännetecknar en bra design för en museiguide-app?
En bra design för en museiapp står inte i vägen: en självklar handling, att skanna ett konstverk, ett lugnt premiumuttryck och full tillgänglighet. I Museo använde vi designsystemet Dark-Luxury (djup obsidian med varma kopparaccenter), så att konstverket får huvudrollen medan gränssnittet känns som själva museet.
Hur designar man en tillgänglig museiapp?
Varje skärm i museiguiden Museo är designad enligt WCAG 2.1 AA: stora tryckytor, stark kontrast, etiketter för skärmläsare och ett barnvänligt läge. Så kan besökare i alla åldrar och med olika förutsättningar använda den.
Hur lång tid tar det att designa en museiapp?
Med AI-stödd prototyping utforskade vi dussintals UI-riktningar och en komplett klickbar prototyp på dagar, inte veckor. Sedan gick en validerad design av appen direkt vidare till utveckling.
Vilken designstil passar bäst för en museiapp?
Museer är lugna premiummiljöer, så en mörk, elegant stil med en enda varm accent fungerar bättre än ett skrikigt, plottrigt gränssnitt. Museos Dark-Luxury-palett, obsidian och koppar, valdes för att matcha stämningen i ett galleri.
Från idé till klickbar prototyp. Snabbt.
Sedan byggde vi den riktiga appen. Se hur Museo-appen utvecklades →
Hämta Museo-appen
Let's make something together.
På Codigee står vi för öppenhet, effektivitet och enkelhet. Inget överkrångel. Ingen bortkastad tid.
Bara rakt på sak och leverans.
We are obsessed.
Varje miljardföretag började med ett beslut, ett steg, en iteration. Nyckeln? Att agera och leverera snabbt.