Innehållsapp

Vilket innehåll till din app

”Innehållsapp” är en bred term. Mellan avsnitten och funktionerna som finns i ditt back office kan du täcka i stort sett vilket projekt som helst, oavsett bransch.

Den här guiden går igenom de nio innehållsavsnitten, med, för vart och ett, vad det tillåter, hur du använder det, och vilken layout du ska välja när det finns en. Den avslutas med CMS:et och kopplingarna, som avgör en grundläggande fråga: att skapa ditt innehåll i GoodBarber, eller att ta in innehållet du redan producerar på annat håll.

Kapitel 1De sju demoapparna

Exemplen nedan vilar på sju appar, fördelade på tre familjer. Hitta den som liknar ditt projekt, och anpassa sedan.

Appar för innehållsskapare

River Daily för en lokaltidning, Piu Piu för en festival, Portland för en reseguide.

  • Blogg: skapa artiklar fritt, illustrerade med bilder och videor.
  • Galleri: visa dina bilder i flera presentationer.
  • Video: dela ditt filmade innehåll.
  • Ljud: publicera dina poddar.
  • Karta: skapa innehåll knutet till bestämda platser.
  • Formulär: ställ frågor till dina användare, samla in och analysera svaren.
  • Evenemang: kommunicera om evenemang, presenterade efter datum.
  • Intern och extern annonsering: skapa intäkter från ditt innehåll.
Tre startskärmar från innehållsappar: en lokal dagstidning, en musikfestival med sina datum, och en stadsguide. Under varje telefon påminner en ikon om ämnet.
Tre innehållsappar, och tre sätt att presentera ämnet redan på första skärmen.

Tjänsteföretag

Freyja Spa för en skönhetssalong, Ivar Madsen för en inredningsbyrå.

  • Blogg: presentera dina tjänster och behandlingar, eller bygg en portfölj.
  • Kontakt: samla dina kontaktuppgifter på en enda sida.
  • Om: presentera dig på en egen sida.
  • Formulär: förvandla det till en bokningsförfrågan.
  • Lojalitetskort och klubbkort: bygg ett lojalitetsprogram och öka engagemanget.
Två startskärmar från tjänsteappar: ett spa och en inredare. Under varje telefon påminner en ikon om branschen.
Två tjänsteföretag, vars katalog listar behandlingar och projekt i stället för produkter.

Utbildning och organisationer

Paraigua för en skola, Dali Corp för en intern företagsapp.

  • Blogg: sprid ditt innehåll till din publik.
  • Autentisering: låt dina användare skapa en profil.
  • Användare: publicera listan över dina användare och deras profiler.
  • Användargrupper: segmentera din publik och leverera innehåll som är särskilt för varje grupp.
  • Chatt: öppna ett diskussionsutrymme i appen.
  • Evenemang: kommunicera om dina evenemang.
  • Formulär: ställ frågor till dina användare och analysera svaren.
Två startskärmar: en skola och ett företag, den ena på fotot av sin byggnad, den andra på sin produkt. Under varje telefon påminner en ikon om området.
En skola och ett företag: samma avsnitt, i tjänst hos kurser och interna nyheter.

Kapitel 2Att lägga till ett avsnitt

Draget är detsamma för varje avsnitt som beskrivs i den här guiden. Gå till My App Structure, klicka på Add, och välj sedan typen du vill ha.

Du kan lägga till upp till 120 avsnitt i en app, och samma innehåll kan dyka upp i flera avsnitt samtidigt. Det är det som gör organisationen så flexibel: ett avsnitt är ingen förseglad låda, det är en vy över ditt innehåll.

Panelen för att lägga till ett avsnitt, öppen på katalogen med tillgängliga typer: blogg, galleri, video, sociala nätverk, informationssida, kontakt, karta, kalender, poddar, flöde och formulär, med en länk för att visa fler. Längst ner räknaren över avsnitt som redan används. Till vänster visar förhandsvisningen av appen menyn växa.
Sexton avsnitt använda av hundratjugo: katalogen är längre än vad de flesta appar någonsin behöver.

Kapitel 3Bloggen

Vad det är till för

Avsnittet Blogg låter dig skapa innehåll direkt från back office, i form av artiklar berikade med foton och videor.

För en innehållsskapare är det det centrala avsnittet. Men oavsett ditt projekt kommer du att använda det minst en gång: det är det mest mångsidiga avsnittet av alla, och du kommer att se nedan att det böjer sig lätt till andra användningar.

Att skapa artiklar. En artikel byggs i stycken av text, som du lägger till foton, videor, citat eller inbäddningskod till.

Redigeraren öppnas från Content Add An article. Artiklar du redan publicerat finns i Content Content list All articles.

När innehållet väl är skapat ställer du in:

  • avsnittet eller avsnitten artikeln hör till
  • författaren
  • miniatyrbilden
  • en sammanfattning, som kommer att synas i artikellistan
  • om kommentarer är påslagna eller inte

Fliken SEO låter dig dessutom fylla i metadata och anpassa adressen.

Att redigera en artikel i back office. Till vänster dess titel och dess bild. Till höger redigeringspanelen öppen på sin första flik: listan över kategorier artikeln syns i, med sina underkategorier, var och en möjlig att kryssa för; författaren; publiceringsdatum och tid; en ruta för att fästa den högst upp i listan; och miniatyrbilden som används i listor.
En artikel kan ligga i flera kategorier samtidigt: så matar en enda blogg flera avsnitt.

Tre sätt att använda det

Dynamiskt innehåll. Det är dess första syfte. I nyhetsappen River Daily täcker flera Blogg-avsnitt tidningens olika redaktioner, vissa med kategorier för att förfina navigeringen ytterligare.

I artikelns detaljvy visas publiceringsdatumet, kommentarer är påslagna, tillsammans med delning och favoritmarkering.

En katalogpresentation. Hos Freyja Spa presenterar Blogg-avsnitten salongens behandlingar. De tre avsnitten som används är samlade inne i ett menyavsnitt.

Den intressanta omvägen finns här: sammanfattningsfältet, avsett för en ingress, används för att visa varje behandlings längd i listan. Den mest avgörande informationen är alltså läsbar med en blick, utan att sidan öppnas.

Detaljvyn upprepar längden, priset, beskrivningen av behandlingen och en länk till bokningsformuläret. Kommentarerna är påslagna och fungerar som en samling kundomdömen.

Statiskt innehåll. Appen Portland är en reseguide, och dess Blogg-avsnitt levererar tips till besökarna.

Här finns varken författare eller publiceringsdatum: den informationen skulle inte tillföra något till innehåll som inte blir inaktuellt.

Två avsnitt i en nyhetsapp: till vänster en lista där den första artikeln visas stor och de följande i rader; till höger ett avsnitt krönt av ett fält med underkategorier som filtrerar samma lista.
Samma blogg två gånger: som enkel lista, och sedan krönt av raden som filtrerar underkategorierna.
Detaljerna för en artikel: bilden högst upp, titeln, publiceringsdatumet, sedan texten i marginaljusterade stycken. Längst ner på skärmen kommentarer, delning och bokmärkning.
Längst ner i artikeln tre handgrepp för läsaren: kommentera, dela och spara till senare.
Startsidan i en spa-app: tre behandlingskategorier, var och en en bild i full bredd med sitt namn insatt i sig.
Samma avsnitt som meny för ett spa: tre kategorier, tre bilder och inte en artikel i sikte.
Listan med massagebehandlingar: varje behandling tar en rad med sitt foto, sitt namn och sin längd.
Varje behandling är en artikel, och dess längd tar publiceringsdatumets plats.
Detaljerna för en behandling: foto, namn, längd, pris, sedan en beskrivning i kursiv och en bokningslänk.
Och allra längst ner länken som gör en läsning till en bokning.
Två skärmar från en stadsguide: till vänster listan med artiklar, var och en med sin fyrkantiga miniatyrbild och sin titel, under avsnittets sidhuvud och ovanför flikfältet; till höger artikeln öppen, dess bild, dess titel och dess text.
En stadsguide byggd på samma avsnitt: artiklarna går inte ut, så ingenting här bär ett datum.

Vilken layout du ska välja

Nio layouter finns tillgängliga för listan. De skiljs åt på tre kriterier: volymen artiklar du publicerar, dina bilders styrka, och om du vill framhäva en artikel eller inte.

Layouten ändras i My App Structure: öppna menyn för det berörda avsnittet, och sedan Edit the design.

Utan framhävd post, alla artiklar på samma nivå:

  • Enriched Classic, det universella standardvalet. Måttlig rytm, viktiga metadata synliga. Ta den när ingenting puttar dig mot en mer specialiserad layout.
  • Condensed, för hög redaktionell volym som ska skummas snabbt. Bilden kommer i andra hand.
  • Visual Card, kort i full bredd i en enda kolumn: stor bild överst, titel och ingress nedanför. För när det är bilden som får folk att klicka.
  • Checkerboard, för statiskt innehåll, med titlar som läses i ett ”Z”-mönster.
  • Grid Visual, ett rutnät med likställda artiklar. Kräver en bild på varje post.

Med en framhävd artikel:

  • Une Condensed, en flaggskeppsartikel följd av många kompakta poster. Flödet tar upp volymen.
  • Une Grid Visual, en framhävd artikel och sedan ett rutnät. Kräver en bild på varje post också.
  • Une Story, flera ”förstasidor” i en svepbar karusell, i stil med sociala nätverk, med ett kompakt flöde nedanför. För mycket regelbunden publicering med starka bilder. Finns bara för artiklar.

Specialfallet:

  • Immersive, en artikel per skärm, dominerande bild och navigering genom lodrätt svep. Praktfull med starka bilder, men den håller inte för hög volym.

Regeln som går före alla andra: om dina artiklar saknar bilder, eller har bilder av dålig kvalitet, ska du utesluta Visual Card, Checkerboard, Une Grid Visual, Grid Visual, Une Story och Immersive. Kvar blir Condensed om volymen är hög, annars Enriched Classic.

För artikelns detaljvy lägger standardvyn omslagsbilden i toppen, sedan titeln, datumet och författaren, handlingsfältet (dela, favoritmarkera, kommentera) och brödtexten. När en artikel saknar omslag kommer titeln först i stället för att lämna en tom topp.

En anmärkning som gäller för varje avsnitt: även om vi ibland förknippar en layout med en typ av användning är ingen reserverad för ett bestämt område. Allt beror på dina behov och på din apps övergripande design.

Nio layoutskisser för bloggen, med sina namn. På översta raden: Enriched Classic, Condensed, Visual Card, Checkerboard, Grid Visual. På nedersta raden: Une Condensed, Une Grid Visual, Une Story, Immersive. Var och en visar hur bilden, titeln och sammanfattningen är upplagda i listan, och om den första artikeln skiljer ut sig från de andra.
Nio layouter för ett enda avsnitt, och de tre som heter Une lyfter ut den första artikeln ur mängden.

Kapitel 4Galleriet

Vad det är till för

Avsnittet Galleri visar ett galleri med bilder. Hur det fungerar är minimalt: du lägger till dina foton, du väljer layouten, och det är allt.

Lägg till dina foton med knappen Add a photo, eller genom att dra och släppa från din dator. Flera uppladdningar samtidigt är möjliga, vilket snabbar upp arbetet betydligt.

Den skärmen finns i Content Content list All photos, och direkt tillägg finns i Content Add A photo.

När dina bilder väl är i back office kan du ge dem en titel och en beskrivning, som kommer att synas i detaljvyn.

Panelen för att lägga till ett avsnitt, med en pil som pekar på galleriträdet bland de tillgängliga typerna. Till vänster förhandsvisningen av festivalappen med sitt program och sitt flikfält.
Ett galleri läggs till som vilket avsnitt som helst, från samma panel som bloggen och videon.
Innehållslistan filtrerad på ett galleri, i rutnätsvy. Varje foto bildar ett kort där två uppmaningar väntar på en titel och en bildtext, med en pil som pekar på var de hamnar. Under varje kort publiceringsstatusen, en papperskorg och en kryssruta; högst upp sökningen, filtren och lägg till-knappen.
Varje bild kan bära en titel och en bildtext, och båda uppmaningarna står kvar tills du skriver dem.

Två sätt att använda det

Livet på en skola. Appen Paraigua levererar information till elever och föräldrar, och siktar på att bygga en community kring skolan. Dess Galleri-avsnitt publicerar regelbundet foton från livet på skolan. Den valda layouten lämnar varje bilds titel och beskrivning synliga, för att sätta dem i sitt sammanhang.

En musikfestival. Appen Piu Piu fräschas upp varje år inför den nya upplagan. Galleriet fungerar som ett arkiv: det samlar foton från tidigare år, vilket håller minnet levande för stammisarna och för festivalens anda vidare till nykomlingarna.

Ett galleri i en skolapp: fotona följer på varandra i full bredd, vart och ett med sitt datum och sin titel under sig.
Med titlar och datum läses galleriet som ett nyhetsflöde: bilderna säger vad som hände, och när.
Ett festivalgalleri som en mosaik: fotona sitter två och två utan titlar, och svarar varandra genom sina färger.
Utan dem blir det en stämningstavla, där bilderna svarar varandra genom sina färger.

Vilken layout du ska välja

Tre layouter, som svarar mot tre olika avsikter.

Layouten ändras i My App Structure: öppna menyn för det berörda avsnittet, och sedan Edit the design.

  • Visual Card, standardvalet. En kolumn, kort i full bredd, och framför allt en titel och en bildtext per foto. Det är den enda av de tre som låter dig sätta dina bilder i sitt sammanhang.
  • Square, ett rutnät i två kolumner med kvadrater, utan titlar. För ett mycket komprimerat bildarkiv, när helhetens sammanhang betyder mer än varje foto för sig.
  • Ratio, en mosaik i två kolumner som respekterar varje bilds ursprungliga proportioner. För en portfölj med blandade format.

Med andra ord: om dina foton behöver förklaras ska du ta Visual Card. Om de talar för sig själva och det är många av dem, Square eller Ratio beroende på om de är enhetliga eller inte.

Tre layoutskisser för galleriet, med sina namn: Visual Card, där varje foto tar ett kort med sin titel och sin bildtext; Square, ett rutnät med fyrkantiga miniatyrbilder; Ratio, ett rutnät som behåller varje fotos ursprungliga proportioner.
Tre layouter: bara den första lämnar plats för en titel och en bildtext, de andra två är rutnät.

Kapitel 5Videor

Vad det är till för

Avsnittet Video levererar videor i din app, oavsett om de redan ligger på en extern sajt eller inte.

Lägg till dina videor genom att ladda upp dem från din dator, eller genom att fylla i deras inbäddningskod om de redan bor på annat håll. Precis som för bloggen väljer du sedan visningsavsnitten, författaren, publiceringsdatumet, sammanfattningen och om kommentarer är på.

Redigeraren öppnas från Content Add A video.

Slutligen kan du strukturera sidan genom att vid behov lägga till stycken av text, foton och citat.

Samma panel för att lägga till ett avsnitt, med pilen som den här gången pekar på videorutan. Till vänster visar förhandsvisningen av företagsappen en artikel.
Videoavsnittet heter Web TV och ligger mellan galleriet och de sociala nätverken.
Att skapa en video i back office: i mitten en släppyta som anger den största storleken och erbjuder antingen att ladda upp en fil eller att klistra in en inbäddningskod, med listan över godtagna format. Till höger kategorin, författaren, datumet, fästet högst upp i listan, en sammanfattning och brytaren för kommentarer.
Antingen din egen fil, upp till 500 MB, eller en inbäddningskod: avsnittet tar båda utan att byta form.

Två sätt att använda det

En lokaltidning. River Daily har ingen tv-kanal, men sänder regelbundna program på YouTube, däribland ett dagligt. De är samlade i appens avsnitt Video News.

En intern företagsapp. Hos Dali Corp levererar Video-avsnittet onlinekurser skapade av anställda för anställda. Upplägget gör två jobb på en gång: det samlar personalen kring ett gemensamt projekt, och det ger dem gratis fortbildning.

En videolista i en nyhetsapp: varje rad bär sin miniatyrbild, märkt med en uppspelningsknapp, och bredvid den sin titel eller sitt datum.
Rader med liten miniatyrbild, där en video utan titel faller tillbaka på sitt datum.
En videolista i en företagsapp: miniatyrbilderna tar hela bredden, med sin längd insatt i ett hörn, och publiceringsdatumet och titeln nedanför.
I full bredd, med speltiden infälld i ett hörn: läsaren vet vad det kostar innan hen trycker på play.

Vilken layout du ska välja

Tre layouter för listan.

Layouten ändras i My App Structure: öppna menyn för det berörda avsnittet, och sedan Edit the design.

  • Enriched, standardvalet. Kompakt lista, liten miniatyrbild i 16:9, metadata i förgrunden (titel, datum, författare, beskrivning). Det är rätt val för hög volym som ska skummas.
  • Une Condensed, en framhävd video visad stor med sin ingress, och sedan ett kompakt flöde nedanför. Det här är ”videotidningen”, med dagens förstasida. Håller för måttlig till hög volym.
  • Visual Card, stora kort i full bredd med 16:9-ramen och uppspelningsknappen centrerad. Ta den när det är miniatyrbilden som får folk att klicka.

För detaljvyn tar videospelaren toppen, följd av titeln, datumet, handlingarna, beskrivningen och, om du fyller i en, adressen.

Tre layoutskisser för videon, med sina namn: Enriched, en lista där miniatyrbilden sitter till vänster om titeln; Une Condensed, som ställer den första videon för sig, stor, ovanför de följande; Visual Card, där varje video tar ett eget kort.
Tre layouter, och speltiden syns bara på två av dem.

Kapitel 6Poddar

Vad det är till för

Avsnittet Poddar levererar ljud i din app.

Lägg till ditt ljud genom att ladda upp det från din dator. Precis som för bloggen väljer du visningsavsnitten eller kategorierna, författaren, datumet, sammanfattningen och kommentarerna. Du kan också lägga till externa länkar för att köpa spåret.

Redigeraren öppnas från Content Add A sound.

Sidan struktureras sedan med stycken av text, foton, videor, inbäddningskod och citat.

Panelen för att lägga till ett avsnitt, med pilen som pekar på poddrutan. Till vänster förhandsvisningen av skolappen, vars meny visas som ett rutnät med ikoner.
Två rutor bär ljud, och den här är avsnittet som rymmer dina egna ljudfiler.
Att skapa ett avsnitt i back office: i mitten ett titelfält och en släppyta för ljudfilen. Till höger kategorin vald ur trädet med kurser, författaren, datumet, fästet, två fält för länkar till appbutikerna, och brytaren för kommentarer.
Avsnittet arkiveras under en lektion, och två fält pekar mot plattformarna där podden också ligger.

Två sätt att använda det

En nyhetsapp. River Daily sänder också en radiokanal live. Avsnittet Poddar gör vissa program permanent tillgängliga. Datumen visas i listan, för att hjälpa lyssnarna hitta programmet de är ute efter. Detaljsidan förblir avskalad, utan extra information.

En skola. Paraigua behövde leverera sina lektioner på distans. De presenteras som en lista, kategoriserade efter ämne.

Idén värd att ta med sig finns i detaljsidan: en utskrift av lektionen publiceras där som stycken och bilder. Eleven följer texten och illustrationerna medan hen lyssnar på ljudversionen, vilket gör lektionen användbar i mycket olika situationer.

Två skärmar från en nyhetsapp: till vänster listan med avsnitt, vart och ett med sin titel, sitt datum och sin miniatyrbild; till höger spelaren öppen, med omslaget, datumet, titeln, förloppsindikatorn lagd över en vågform och de tre uppspelningsknapparna.
Spelaren stannar i appen: ingen flik att lämna, och vågformen löper bakom förloppsindikatorn.
En lista med avsnitt i en skolapp, under ett fält med underkategorier som skiljer ämnena åt. Varje rad bär sin miniatyrbild och sin titel.
Samma avsnitt för en skola, där raden med underkategorier skiljer ämnena åt.
Detaljerna för ett avsnitt: omslag, datum, titel, spelare, sedan den skrivna lektionen som följer på ljudet, i stycken med rubriker brutna av ett foto.
Under spelaren den skrivna lektionen: avsnittet lyssnas eller läses, aldrig bara det ena.

Vilken layout du ska välja

Två layouter, och kriteriet som skiljer dem åt är miniatyrbildens storlek. Båda bäddar in spelaren i cellen, med uppspelningsknappen och längden: det är alltså inte uppspelningen som skiljer dem åt.

Layouten ändras i My App Structure: öppna menyn för det berörda avsnittet, och sedan Edit the design.

  • Classic Play, standardvalet. Mindre miniatyrbild, text och metadata dominerar. Det är layouten för långa avsnittslistor, och den för radiomönstret.
  • Enriched, större miniatyrbild, som lyfter fram omslaget. Välj den när omslagsbilden är en del av ditt innehålls identitet, vid måttlig volym.

För detaljvyn fungerar omslaget som ett omslutande täcke, med ljudspelaren, titeln, handlingarna och brödtexten.

Två layoutskisser för podden, med sina namn: Classic Play, där varje avsnitt ställer upp sin miniatyrbild, sin text och sitt uppspelningsreglage; Enriched, som ger mer plats åt miniatyrbilden och sammanfattningen.
Två layouter, och båda håller uppspelningsknappen och speltiden inne i själva listan.

Kapitel 7Live

Vad det är till för

Avsnitten ovan publicerar inspelat innehåll, tillgängligt när din lyssnare bestämmer. Live gör tvärtom: det sänder i realtid, och det är tiden som gör evenemanget.

Tre byggstenar, att kombinera efter vad du sänder.

  • Live-ljud är grundstenen: avsnittet finns utan att något läggs till. Du fyller i adressen till din ström, och appen sänder den. IceCast-kodare stöds inbyggt, vilket täcker den stora majoriteten av radiouppsättningar.
  • Live-video gör samma sak för en bildsändning. Det är ett tillägg, och dess sida visar priset som gäller för din app.
  • Live+ är ett lager ovanpå live-ljudet, som också kommer med ett tillägg. Det visar din ströms metadata bredvid spelaren: spåret som går, programledaren, programmet. Utan det ser din lyssnare en uppspelningsknapp och inget mer; med det ser hen vad hen lyssnar på.

Två egenskaper är värda att känna till innan du bestämmer dig.

Ljudet stannar inte när din lyssnare navigerar. Spelaren följer användaren från skärm till skärm och fortsätter med skärmen avstängd. I praktiken kan folk lyssna på din kanal medan de läser dina artiklar, vilket helt ändrar hur en radioapp används.

Du kan öppna flera live-avsnitt. En radiokanal med två kanaler, en festival med två scener, en församling med två gudstjänster: varje ström har sitt eget avsnitt.

En sista skillnad mot avsnitten ovan: live har bara en presentation. Det finns ingen layout att välja.

Två sätt att använda det

En lokal radiokanal. River Dailys radio, som nämndes i föregående kapitel, bor i ett Live-avsnitt. Poddarna behåller programmen på begäran, live-avsnittet bär kanalen. Live+ visar spåret som går och dess artist, vilket ger en lyssnare som kommer in mitt i programmet något att placera sig efter.

En festival. Piu Piu sänder sin scen live under alla fyra dagarna. Publiken som inte kunde komma följer kvällen, och stammisarna hittar tillbaka till stämningen hemifrån. Live arbetar vid sidan av Evenemang-avsnittet, som förblir appens huvudavsnitt: programmet meddelar, live sänder.

Två detaljer på den skärmen är värda att peka ut. Sovläget stoppar uppspelningen efter en vald fördröjning, vilket räknas i en kanal folk lyssnar på om kvällen. Och spelaren tar upp appens färger och typografi: det är samma skärm som hos River Daily, och ändå ser det inte ut som samma produkt.

River Dailys livespelare: runt omslag, uppspelningsknapp, förfluten tid, sedan artistens namn och låtens titel som visas av Live+. Längst ner påminner en beständig minispelare om vad som spelas.
Utan Live+ skulle lyssnaren bara se uppspelningsknappen.
Samma liveskärm hos Piu Piu, i festivalens mörka och orange färger, med en knapp för sovläge uppe till höger och den beständiga minispelaren längst ner.
Samma skärm som ovan, två identiteter: spelaren följer appens design.

Kapitel 8Karta

Vad det är till för

Avsnittet Karta skapar geolokaliserade punkter som visas på en karta. Dina användare upptäcker platserna och får vägbeskrivning dit.

För att skapa en punkt fyller du i dess adress eller dess koordinater på redigeringssidan.

Redigeringssidan öppnas från Content Add A location.

Sedan fyller du på beskrivningen med text, foton, videor, citat eller inbäddningskod. Högerpanelen låter dig välja visningsavsnitten och lägga till handlingsknappar:

  • en ringknapp
  • en mejlknapp

Slutligen kan du lägga till en extern länk, och anpassa formen och färgen på ikonen som representerar punkten.

Panelen för att lägga till ett avsnitt, med pilen som pekar på kartrutan. Till vänster förhandsvisningen av stadsguiden, med sin sökning och sina rutor.
Kartan är ett innehållsavsnitt som de andra, inte en modul lagd på en sida.
Att skapa en plats i back office: dess namn, dess adress, dess koordinater, och till höger kartan som placerar dem. Nedanför en textredigerare för att beskriva den. I högerpanelen kategorierna den syns i, ett telefonnummer och en e-postadress som blir handlingsknappar, en webbadress, och sedan valet av form och färg på dess markör.
Även markören väljs här: fem former och en färg, så att två kategorier aldrig liknar varandra.

Tre sätt att använda det

Ett skolcampus. Paraigua är utspritt över flera byggnader. Nykomlingar, elever såväl som föräldrar, behövde kunna identifiera dem med en blick och få vägbeskrivning.

Fyra platser skapades, presenterade först som en lista. Kartvyn visar alla punkter och avstånden. Att klicka på en punkt ger en sammanfattning och åtkomst till detaljvyn, där vägbeskrivningsknappen är huvudsaken, kompletterad av en beskrivning och en bild.

Ett företag på flera orter. Dali Corp har kontor i flera amerikanska städer, och bryr sig om sin företagskultur. Ett Karta-avsnitt presenterar de tre kontoren.

Detaljvyn är fylligare än hos Paraigua: foton beskriver kontoret och dess stämning, och vägbeskrivningsknappen sitter under fotona. Kartan finns inte bara till för att orientera folk, den finns till för att låta de andra orterna existera för dem som aldrig åker dit.

En reseguide. I appen Portland är kartan produktens hjärta. Flera Karta-avsnitt presenterar stadens platser, sorterade efter typ.

Detaljvyn innehåller en fullständig beskrivning, foton där det behövs, vägbeskrivningsknappen framhävd, och en extern länk till varje ställes webbplats när det har en.

Tre skärmar från en skolapp: listan med platser, var och en med sitt foto, sitt namn och sin adress; kartan, där markörerna sprider ut sig och en av dem öppnar sin etikett; detaljerna för en plats, med sitt foto, sin adress, en vägbeskrivningsknapp, listan över sina tjänster och en karta längst ner.
Lista, karta, detalj: tre vyer av samma platser, och en rund knapp för att växla mellan dem.
Detaljerna för ett kontor i en företagsapp: inledningsfotot, namnet, adressen, en inledande rad, sedan fyra foton av lokalerna, vägbeskrivningsknappen och kartan.
Ett kontor presenterat som en artikel, med vägknappen och kartan sparade till allra sist.
Två skärmar från en stadsguide: till vänster listan med platser, under ett fält med underkategorier, med en rund knapp som växlar till kartan; till höger kartan i helskärm, dess markörer, och knappen som går tillbaka till listan.
Underkategorierna filtrerar listan och kartan samtidigt: markörerna följer den öppna fliken.
Detaljerna för en sevärdhet: foto, namn, adress, vägbeskrivningsknapp, sedan en beskrivning som växlar mellan stycken, en punktlista och foton, en knapp till webbplatsen, och kartan längst ner.
En plats kan rymma lika mycket som en artikel: stycken, en lista, bilder och en egen utgående länk.

Vilken layout du ska välja

Tre layouter, och det verkliga kriteriet är hur mycket plats du ger själva kartan.

Layouten ändras i My App Structure: öppna menyn för det berörda avsnittet, och sedan Edit the design.

  • Enriched, standardvalet. Kompakt lista, liten miniatyrbild, titel och adress, flera platser per skärm. Kartan är dold bakom en knapp. Det är kataloglayouten, för när användaren redan vet vad hen letar efter.
  • Visual, stor dominerande miniatyrbild, få platser per skärm. Kartan förblir dold bakom en knapp. För ett galleri av platser där det är bilden som lockar.
  • Split Enriched, den interaktiva kartan tar toppen av skärmen och listan syns nedanför. Välj den när det rumsliga förhållandet mellan platserna bär mening, alltså när kartan är ämnet.

Du bestämmer också om en sammanfattande lista ska visas över kartan eller inte. Gå till My App Structure, öppna Karta-avsnittet, och sedan vyn med punktlistan: inställningen finns i innehållsytan, under ”Map view”.

För en plats detaljvy får du fotot, namnet, adressen, vägbeskrivningsknappen, ett galleri och den lokaliserade kartan.

Tre layoutskisser för kartan, med sina namn: Enriched, en lista där varje plats bär sin markör och sin adress; Visual, som ger varje plats en stor miniatyrbild; Split Enriched, som lägger kartan överst och listan under.
Tre layouter, och bara den sista visar kartan och listan på samma skärm.
Designinställningarna för ett kartavsnitt. Inringade styr två brytare om listan visas och om den öppnas före kartan. Nedanför bakgrundsfärgen, kanten, genomskinligheten, vad varje rad visar, och titelns typografi. Till vänster tillämpar förhandsvisningen inställningarna direkt.
Två reglage avgör om listan finns alls, och om den kommer före kartan.

Kapitel 9Formuläret

Vad det är till för

Avsnittet Formulär samlar in information från dina användare, genom fält av olika slag.

Dina formulär listas i Content Content list All forms. Att öppna ett visar formulärets redigeringspanel till höger, vars fältflik bär paletten nedan.

Sexton fälttyper finns tillgängliga:

  • en enda textrad
  • ett stycke text
  • flerval
  • namn
  • datum
  • e-postadress
  • extern länk
  • filuppladdning
  • tal
  • kryssrutor
  • rullgardinsmeny
  • adress
  • tid
  • telefon
  • pris
  • avsnittsbrytning

Klicka på typen du vill ha så dyker den upp i redigeringsytan, där du anpassar dess innehåll.

Glöm inte att berika formuläret med foton, videor, text, citat eller inbäddningskod också: ett avskalat formulär får färre svar än ett formulär som förklarar vad det är ute efter.

Panelen för att lägga till ett avsnitt, med pilen som pekar på formulärrutan, i en katalog som har blivit längre. Till vänster förhandsvisningen av inredarens app, med menyn öppen.
Längre ner i samma katalog, förbi avsnitten som publicerar, kommer de som samlar in.
Att redigera ett formulär: till vänster dess titel och en illustration; till höger paletten med tillgängliga fält, en enda textrad, ett tal, ett stycke, kryssrutor, ett enskilt val, en rullgardinsmeny, ett namn, en adress, ett datum, en tid, en e-postadress, ett telefonnummer, en webbplats, ett pris, en fil och en avsnittsbrytning.
Sexton fälttyper, däribland en adress och en fil: formuläret byggs med klick, aldrig med kod.

Två sätt att använda det

En tjänsteapp. Hos Ivar Madsen, inredningsarkitekt, sköter formuläret bokningsförfrågningar och offertförfrågningar.

Sidan har tre mål: att presentera erbjudandet, att lära känna den blivande kunden, att tillåta en första kontakt. En bild och en förklarande text sätter sammanhanget, och sedan går formuläret rakt på sak:

  • ett namnfält och ett e-postfält för att identifiera kunden
  • två styckefält för att uttrycka hens behov och hens projekt
  • ett datumfält för att ange hens tillgänglighet

En företagsapp. Hos Dali Corp kör HR regelbundet enkäter för att mäta de anställdas välbefinnande och samla in deras åsikter.

Formuläret är medvetet mycket kort, för att maximera svarsfrekvensen. En inledande text, sedan fem fält:

  • ett namnfält och ett teamfält för att identifiera den anställda
  • två flervalsfält för att svara på ledningens frågor
  • ett styckefält för att tala fritt
Ett kontaktformulär skrollat uppifrån och ner: titeln, ett foto, fyra block som förklarar vad som kommer att frågas, sedan fälten att fylla i, namn, e-postadress, fastighetens adress med sina underfält, projektbeskrivning, önskad stil och tillgänglighet med en datumväljare. En skicka-knapp avslutar sidan.
Fyra block förklarar vad som ska frågas innan något frågas: formuläret börjar med att lugna.
En intern enkät i en företagsapp: efter inledningen ett namnfält, en rullgardinsmeny för team, två frågor med enskilt val och ett fritt fält, sedan skicka-knappen.
Samma avsnitt som intern enkät, där frågorna är slutna och den sista inte är det.

Att dra nytta av svaren

Gå till Content Content list. Håll muspekaren över det berörda Formulär-avsnittet och klicka på länken som visar dess innehåll. Där hittar du listan över mottagna svar.

Att klicka på en rad visar en användares svar, som du kan exportera som en .csv via Export data. Samma knapp, från listvyn, exporterar alla svar.

Den exporten är det som gör avsnittet verkligt användbart: utan den läser du svar ett och ett; med den analyserar du dem som helhet.

Svaren på ett formulär i back office, som en tabell: datumet, formulärets fält som kolumner, och den bifogade filen. En papperskorg avslutar varje rad. Inringade av pilen, uppe till höger, dataexporten och vägen tillbaka till att redigera formuläret.
Svaren landar i en tabell du kan exportera: ingenting blir inlåst i appen.

Kapitel 10Inskickat innehåll

Vad det är till för

Avsnittet Inskickat innehåll låter dina användare skicka innehåll till dig från appen, som text, foton eller videor. Allt landar i ditt back office.

Det du tar emot hamnar i Content Content list All sent in content.

Det finns inget att konfigurera, om du inte vill begränsa vilka innehållstyper som accepteras. I så fall lägger du till tillägget API Access och redigerar avsnittets JSON. Det är en enkel åtgärd och steg-för-steg-hjälp finns i ditt back office.

Panelen för att lägga till ett avsnitt, med pilen som pekar på rutan för inskickat innehåll. Till vänster förhandsvisningen av inredarens app, med menyn öppen.
Inskickningsavsnittet är det som låter dina läsare skriva i appen i stället för att bara läsa den.

Tre sätt att använda det

En intern förslagslåda. Hos Dali Corp öppnade ledningen ett utrymme där de anställda kan lämna sina synpunkter och rekommendationer när som helst. Innehållet som kommer in publiceras inte: det analyseras för att förbättra arbetsvillkoren.

En festivals minnen. Piu Piu satsar på sin community och vill visa festivalens verkliga stämning. Avsnittet Your Memories samlar in deltagarnas foton och videor. Att skicka text stängdes av.

Läsartips. River Daily vill vara först med lokala nyheter. Ett öppet avsnitt låter läsarna föra vidare sin information, som journalisterna arbetar om innan publicering.

De tre fallen visar tre olika regimer: innehåll som aldrig kommer att publiceras, innehåll som publiceras nästan som det är, och innehåll som tjänar som råmaterial för redaktionellt arbete. Bestäm vilken som är din innan du öppnar avsnittet, för det ändrar vad du meddelar dina användare.

Två skärmar från en företagsapp: till vänster menyn, där en post bjuder in de anställda att bidra; till höger skärmen för att publicera, som erbjuder tre drag, en bild, en video eller en text, vart och ett med sin anvisning.
Tre handgrepp för en anställd: en bild, en video eller en text, och inget mer att lära sig.
Samma mekanism i en festivalapp: menyn bjuder in besökarna att lägga upp sina minnen, och skärmen för att publicera behåller två drag, bild och video, vart och ett på sin egen färgade bakgrund.
Samma skärm för en festival, nerskuren till två handgrepp och klädd i appens egna färger.
I en nyhetsapp: menyn bär två poster för bidrag, och skärmen för att publicera bjuder in läsarna att rapportera nyheter från sin stad genom att skicka en bild, en video eller en text.
På en redaktion blir det en tipslinje, och texten säger vem som läser det som kommer in.

Att sköta det du tar emot

Gå till Content Content list, håll muspekaren över ditt avsnitt för inskickat innehåll och klicka på länken som visar dess innehåll.

Du sköter publiceringen i klump, via kryssrutorna till höger om varje rad, eller fall för fall genom att öppna en post. Du kan alltså redigera och sedan publicera med ett klick det dina användare har skickat dig.

Inskickat innehåll i back office: varje rad bär bilden som skickats in, en notering om vilken app den kom från, avsändarens e-postadress, datumet och en statusbricka som markerar den som inskickad, i väntan på godkännande. En papperskorg avslutar varje rad.
Allt kommer in som inskickat: ingenting når appen förrän back office godkänner det.

Kapitel 11Evenemang

Vad det är till för

Avsnittet Evenemang presenterar ditt innehåll som daterade evenemang.

För att skapa ett evenemang väljer du först dess datum och dess längd. Alternativet ”hela dagen” besparar dig att fylla i ett tidsintervall. Sedan kan du koppla en adress till det.

Redigeraren öppnas från Content Add An event.

Sidan byggs i stycken, med text, foton, videor, citat och inbäddningskod.

Högerpanelen låter dig välja visningsavsnitten eller kategorierna, lägga till handlingsknappar (ringa, mejla), en extern länk och en knapp för att köpa biljett.

Panelen för att lägga till ett avsnitt, med pilen som pekar på kalenderrutan. Till vänster förhandsvisningen av festivalappen, med programmet och sitt flikfält.
Kalenderavsnittet daterar sitt innehåll i stället för att publicera det: ett evenemang har en början och ett slut.
Att redigera ett evenemang i back office: dess titel, dess start- och slutdatum, en ruta för hela dagen, sedan platsen med sina koordinater och kartan som lokaliserar den. Till höger kategorin, ett telefonnummer och en e-postadress som handlingsknappar, en webbadress, en biljettlänk och miniatyrbilden till listan.
Biljettlänken har ett eget fält, skilt från webbplatsen: evenemanget är gjort för att säljas.

Två sätt att använda det

En intern företagsapp. Dali Corp använder två Evenemang-avsnitt. Det första kommunicerar om interna evenemang: workshoppar, afterwork, öppet hus. Det andra delar företagets färdplan, så att alla känner till tidsfristerna och projekten som pågår.

Den andra användningen är den mest överförbara: evenemangsavsnittet är inte reserverat för evenemang du går på, det tjänar också till att göra en kalender synlig.

I detaljvyn dyker adressen och vägbeskrivningsknappen upp när de är relevanta.

En festival. Hos Piu Piu är Evenemang appens huvudavsnitt: det är festivalprogrammet.

Detaljvyn är fullständig: adress, datum, knapp för att köpa biljett, beskrivning, länk till artisternas webbplats, ringknapp, mejlknapp, vägbeskrivningsknapp, tillsammans med favoritmarkering och delning.

Två skärmar från en företagsapp: till vänster listan med evenemang, vart och ett med sin datumbricka, sin bild och sin tid eller plats; till höger detaljerna för ett evenemang, med sitt foto, sin plats, sitt datum, en vägbeskrivningsknapp och kartan.
Datumbrickan gör sorteringen: läsaren tar in månaden innan hen läser titeln.
Detaljerna för en konsert i festivalappen: fotot, bandets namn, platsen, datumet, en biljettknapp, presentationen, sedan fyra knappar, webbplats, telefon, vägbeskrivning och e-post, och kartan längst ner.
Biljettköpet ligger ovanför presentationen, och de fyra vägarna till platsen under den.

Vilken layout du ska välja

Två layouter, som motsvarar två motsatta hållningar.

Layouten ändras i My App Structure: öppna menyn för det berörda avsnittet, och sedan Edit the design.

  • Classic, standardvalet. Evenemangen är grupperade under dagsrubriker, med en liten miniatyrbild, tiden, titeln och platsen, flera per skärm. Det är kalendern du bläddrar i efter datum, när ”när” och ”var” betyder mer än bilden.
  • Classic Bullet, varje evenemang i en stor dominerande miniatyrbild med en datumbricka, ett eller två per skärm. Det är skyltfönstret, när det är evenemangets affisch som får folk att vilja komma.

Valet går alltså tillbaka på en fråga: kommer dina användare för att läsa ett program, eller för att bli lockade?

För ett evenemangs detaljvy får du omslagsbilden, titeln, adressen, datumen, beskrivningen, vägbeskrivningen och kartan över platsen.

Två layoutskisser för kalendern, med sina namn: Classic, en lista med evenemang grupperade per dag, vart och ett med sin miniatyrbild och sin plats; Classic Bullet, som ställer upp datumen som brickor vid sidan och ger varje evenemang en stor bild.
Två layouter, och den andra gör datumet till en bricka längs kanten.

Kapitel 12CMS:et och kopplingarna

Vad CMS:et tillför

Ett CMS (content management system) låter dig skapa och formatera ditt innehåll från ett back office för att publicera det. Hos GoodBarber är det plattformens hjärta.

Utöver skapandet ger det dig:

  • Hantering av innehållsstatus. Published, In stock eller Draft, för att styra vad du publicerar.
  • Schemalagd publicering. Du sätter dagen och tiden för lanseringen i förväg, vilket spelar särskilt stor roll för nyhets- eller bloggappar.
  • Kategorisering. Ett obegränsat antal kategorier för att sortera ett avsnitts innehåll, alltså en extra navigeringsnivå utan att din meny överbelastas.
  • Sortering. Efter skrivdatum, i bokstavsordning eller efter antal kommentarer.
  • Centraliserad hantering. En instrumentpanel samlar allt innehåll som skapats i CMS:et, med filter för att hitta och hantera poster i klump.
  • Avancerad anpassning av metadata. Den tjänar både till att uppmuntra läsning och till din SEO, och du behåller kontrollen över hur den visas.
  • Framhävning av innehåll. Företrädesvisning för innehållet du väljer, från dess redigeringssida.
  • Avancerad designanpassning. Varje posts design kan ställas in oberoende av appens allmänna inställningar.

Vad kopplingarna tillför

Om du redan producerar innehåll på annat håll behöver du inte publicera det igen. Fler än 30 kopplingar utvecklade av GoodBarber tar in det i din app, och formaterar det så att appens visningsstandarder och design respekteras.

Ett cachesystem garanterar laddningstider och stabilitet, utan att dina servrar överbelastas. Dina bilder skalas om, komprimeras och cachas av GoodBarber.

Den avgörande fördelen är synkroniseringen: innehåll som produceras på din externa källa hålls uppdaterat i appen, med en visning anpassad till mobil, surfplatta, bärbar dator och stationär dator. Du behöver aldrig mer publicera två gånger.

Listan över kopplingar

Varje koppling matar en bestämd innehållstyp, och innehållet som tas in beter sig sedan som om det hade skapats i CMS:et.

Artiklar: WordPress, Squarespace, Wix, Medium, Substack, X, RSS

Foton: Flickr

Videor: YouTube, Vimeo, RSS

Ljud och poddar: Ausha, Spreaker, Simplecast, Spotify for Podcasters, poddflöde, RSS

Evenemang: iCal och vCalendar, RSS

Kartor: KML, RSS

Egna kopplingar. Om din källa inte täcks producerar du ett flöde i formatet som den avsedda innehållstypen väntar sig, och du uppger dess adress. Skräddarsömmen begränsas till att producera flödet: visningen, layouterna, sökningen och metadatan förblir plattformens. Detaljerad dokumentation beskriver det förväntade formatet.

Ingenting tvingar dig att välja mellan de två: du kan blanda internt innehåll, skapat i CMS:et, och externt innehåll som tas in av kopplingarna, i en och samma app.