iPad Magazine Interface Design

En bra tidning är mer än bara en samling artiklar om ett tema eller en idé, det är en kurerad redaktionell upplevelse. Genom layoutdesign och kopiering kan det ta dig till olika platser och lära dig nya saker. Utgåvan av iPad har sparkat av det senaste kapitlet i tidskriftsdesignets historia. Jag har jobbat med att starta, Sideways.com, för att skapa vår egen magasinpubliceringsplattform och här är vad vi gjort.

Denna post är dag 10 i vår gränssnittsdesignsession. Creative Sessions

Var vi började

Innan iPad släpptes arbetade vi på en iPhone-tidning, kallad TapTilt, där vi kunde testa några av våra idéer. Det långsiktiga målet var inte bara att publicera tidningar utan att bygga en publiceringsplattform som andra skulle kunna använda för att enkelt föra sina böcker och tidskrifter i iTunes Store som en app.

Av grov iTunes har redan ett bokformat (ePub) och det finns en Kindle-app på iPhone och iPad som även använder ePub-formatet. EPubs fungerar bra för text men inte för mer interaktiva upplevelser. Tidskrifter, barnböcker, grafiska romaner och andra publikationer som är starka beroende av illustrationer eller interaktioner kan inte fungera bra i ett ePub-dokument.

Titta på andra Mags

Skrivartidningar bygger i stor utsträckning på hela sidannonser för att täcka produktionskostnaderna. När du skickar innehållet till iPad med hela sidformatet var det enkelt att hålla annonserna intakta. De är också ovilliga att ändra sina format och innehåll drastiskt, eller de digitala utgåvorna räknas inte med deras totala cirkulationsnummer. För att se till att läsarna ser de här annonserna var de flesta tidningar fast vid tanken att svepande åt vänster och höger genom sidor som du skulle skriva ut motparterna. Förutom att navigera genom att svepa fram och tillbaka många tidiga iPad-tidskrifter som börjar experimentera med nya typer av navigering.

När vi tittade på tidningarna som var tillgängliga för enheten ville vi se vad de gjorde bra och var de kunde förbättra. De flesta tog video i sina publikationer och försökte hantera de två olika skärmorienteringarna på iPad. Men dessa tidiga tidningsapplikationer utnyttjade inte några av de grundläggande funktionerna på webben som hyperlänkning, många har inte ens levande text (texten är gjord som ett bild eller oläsligt format) vilket innebär att du inte kan söka det , kopiera och klistra in eller ändra storlek på text för att förbättra läsbarheten.

Den mest högprofilerade (och framgångsrika tidningen app) hittills på iPad har varit Wired's June issue. En titt bakom kulisserna i hur appen byggdes ger oss en bra känsla för några av de utmaningar som många tidningsutgivare står inför när de överför sina innehåll över.

Starta en plattform (Bygg med HTML och CSS)

Många av de svagheter vi hittat i andra tidningar kom från våra erfarenhetsbyggnader för webben. De är tidskriftsutgivare som försöker förstå webben och vi var webbdesigners som försökte förstå tidningen publicering. Vi kan dra nytta av att dela och diskutera genom sociala medier som Twitter och Facebook. Vi kunde släppa våra musikrecensioner dagen musiken släpptes istället för att vänta en hel månad för att publicera. Vi kan också integrera med iTunes Store så att användarna kan förhandsgranska låtar direkt i appen. Och det är bara att skrapa ytan på vad du kan göra inom en tidningsapp.

För att dra nytta av allt detta verkade det som ett nej brainer att använda HTML och CSS som vårt primära sätt att betjäna innehåll. Vi hade också den extra fördelen av att ha webbkit (Mobile Safari) som gör våra layouter. Det låter oss spela med HTML5 och CSS3 utan att behöva oroa dig för bakåtkompatibilitet med äldre webbläsare. Detta minskar avsevärt utvecklingen på framsidans utvecklingstid.

Eftersom navigering var en inkonsekvens i några av de andra tidskriftsapplikationerna som vi använde, blev det en prioritet tidigt att experimentera med något mer universellt. Visa tidningen i porträttläge gav dig en fullständig sidvy med navigationen tillgänglig i skärmens övre vänstra hörn, roterande till landskapet placerade mer en statisk navigering på vänster sida av skärmen. I nästa utgåva kommer vi att försöka ta navigeringen från landskapsorienteringen och flytta den till en knapp uppe och lämna mer fastigheter att använda för layoutdesign.

Hämta Sidways App

Publicering på iPad har just börjat. Studier om användbarhet (som den här av Jakob Nielsen) fortsätter att forma hur vi designar för mobila enheter. En sak säkert men det är ett övertygande medium att designa för.


Denna post är dag 10 i vår gränssnittsdesignsession. Creative Sessions