PubQ:s startsida på en surfplatta på ett träbord, bredvid nycklar och en penna

Kassan på startsidan

Om projektet

PubQ i Norrköping gör mjukvara för måltidsservice. Från appen och kiosken till kassan går beställning och betalning genom samma plattform. De behövde en webbplats som visar allt på en gång.

tjänster

Digital

,

Design

kund

PubQ

Sektionen Everything you need to run a canteen på PubQ:s startsida, i ett fönster
PubQ:s sida för webbeställning i en mobil
Sektionen One control room, every channel på PubQ:s startsida, i ett fönster
Sektionen om kiosken på PubQ:s webbplats: Members recognised at the kiosk och Tap to pay, no extra terminal
Sektionen Everything you need to run a canteen på PubQ:s startsida, i ett fönster
Sektionen One control room, every channel på PubQ:s startsida, i ett fönster
PubQ:s sida för webbeställning i en mobil
Sektionen om kiosken på PubQ:s webbplats: Members recognised at the kiosk och Tap to pay, no extra terminal

Koncept

Under 2026 designade och byggde vi pubq.se i Framer. Skärmdumpar blir gamla fort, så produkten är byggd in i sidan. Kassan, webbeställningen och kaffekortet är kodkomponenter och inte bilder. Tjänsterna ligger per produkt och per bransch, så att en restaurang och en arena hittar var sin väg in.

Ett vinklat rutnät av PubQ:s webbplats och produkt: startsidan, kiosken, kassan, köksskärmen, appen och kortbetalning

Bildspråk

Vi redigerade bilderna av gäster och servering så att de hänger ihop: varmt ljus och suddig förgrund, som i en riktig lunchrestaurang. Färgen sparade vi till produkten, där PubQ:s indigo bär kassan och appen.

Sajten är utvald till A1 Gallery, en kurerad samling välgjorda webbplatser.

En kvinna beställer vid en skärm och betalar med mobilen, en av bilderna på PubQ:s webbplats
En gäst vid sin laptop medan personal bär ut mat, en av bilderna på PubQ:s webbplats
En man med mobil och laptop i en lunchrestaurang, en av bilderna på PubQ:s webbplats

VANLIGA FRÅGOR

Bygger ni både webb och app?

Ja. Webbplatser, appar och digitala tjänster, från användarforskning till produktion och drift.

Arbetssättet ser likadant ut oavsett teknik. Vi börjar i användarnas behov, tar fram och testar ett förslag och bygger sedan i steg som går att släppa löpande i stället för i en enda stor leverans.

Vi tar också över tjänster som någon annan byggt. Då börjar vi med en genomgång av kod, innehåll och drift, så att ni vet vad ni har innan vi lovar något.

Läs mer

Bygger ni både webb och app?

Ja. Webbplatser, appar och digitala tjänster, från användarforskning till produktion och drift.

Arbetssättet ser likadant ut oavsett teknik. Vi börjar i användarnas behov, tar fram och testar ett förslag och bygger sedan i steg som går att släppa löpande i stället för i en enda stor leverans.

Vi tar också över tjänster som någon annan byggt. Då börjar vi med en genomgång av kod, innehåll och drift, så att ni vet vad ni har innan vi lovar något.

Läs mer

Bygger ni både webb och app?

Ja. Webbplatser, appar och digitala tjänster, från användarforskning till produktion och drift.

Arbetssättet ser likadant ut oavsett teknik. Vi börjar i användarnas behov, tar fram och testar ett förslag och bygger sedan i steg som går att släppa löpande i stället för i en enda stor leverans.

Vi tar också över tjänster som någon annan byggt. Då börjar vi med en genomgång av kod, innehåll och drift, så att ni vet vad ni har innan vi lovar något.

Läs mer

Hur säkrar ni tillgängligheten?

WCAG är en del av bygget från start, inte en revision i efterhand. Vid lagkrav som EAA, LPTT och DOS kopplar vi på tillgänglighetstjänsten.

I praktiken betyder det att kontraster, tangentbordsnavigering, rubrikstruktur och skärmläsarstöd hanteras när gränssnittet ritas och kodas, långt innan det ska levereras.

Vi testar löpande med både verktyg och för hand. Automatiska tester fångar en del av kraven, resten kräver att någon sätter sig med tangentbord och skärmläsare.

Läs mer

Hur säkrar ni tillgängligheten?

WCAG är en del av bygget från start, inte en revision i efterhand. Vid lagkrav som EAA, LPTT och DOS kopplar vi på tillgänglighetstjänsten.

I praktiken betyder det att kontraster, tangentbordsnavigering, rubrikstruktur och skärmläsarstöd hanteras när gränssnittet ritas och kodas, långt innan det ska levereras.

Vi testar löpande med både verktyg och för hand. Automatiska tester fångar en del av kraven, resten kräver att någon sätter sig med tangentbord och skärmläsare.

Läs mer

Hur säkrar ni tillgängligheten?

WCAG är en del av bygget från start, inte en revision i efterhand. Vid lagkrav som EAA, LPTT och DOS kopplar vi på tillgänglighetstjänsten.

I praktiken betyder det att kontraster, tangentbordsnavigering, rubrikstruktur och skärmläsarstöd hanteras när gränssnittet ritas och kodas, långt innan det ska levereras.

Vi testar löpande med både verktyg och för hand. Automatiska tester fångar en del av kraven, resten kräver att någon sätter sig med tangentbord och skärmläsare.

Läs mer

Vad händer efter lansering?

Vi finns kvar om ni vill det. Efter lansering går det att teckna ett löpande avtal för förvaltning och support.

Det täcker tekniskt underhåll, säkerhetsuppdateringar, övervakning och vidareutveckling. Hit hör också löpande uppföljning, till exempel av hur en AI-assistent svarar eller hur sajten konverterar.

Omfattningen sätts efter hur affärskritisk tjänsten är. Vill ni sköta driften själva lämnar vi över dokumentationen och går igenom den med er.

Läs mer

Vad händer efter lansering?

Vi finns kvar om ni vill det. Efter lansering går det att teckna ett löpande avtal för förvaltning och support.

Det täcker tekniskt underhåll, säkerhetsuppdateringar, övervakning och vidareutveckling. Hit hör också löpande uppföljning, till exempel av hur en AI-assistent svarar eller hur sajten konverterar.

Omfattningen sätts efter hur affärskritisk tjänsten är. Vill ni sköta driften själva lämnar vi över dokumentationen och går igenom den med er.

Läs mer

Vad händer efter lansering?

Vi finns kvar om ni vill det. Efter lansering går det att teckna ett löpande avtal för förvaltning och support.

Det täcker tekniskt underhåll, säkerhetsuppdateringar, övervakning och vidareutveckling. Hit hör också löpande uppföljning, till exempel av hur en AI-assistent svarar eller hur sajten konverterar.

Omfattningen sätts efter hur affärskritisk tjänsten är. Vill ni sköta driften själva lämnar vi över dokumentationen och går igenom den med er.

Läs mer

Fler case