Android UI genom tiderna: Från Droid Sans till Material You

Källa: Nick Sutrich / Android Central

Android OS har funnits sedan 2008, och under den tiden har dess användargränssnitt uppfunnits flera gånger om. Det ursprungliga Android 1.0-gränssnittet som debuterade på T-Mobile G1-den allra första Android-telefonen-var barebones och ganska fult av modern standard. Det var inte förrän Android 4.0, tre år in i operativsystemets livslängd, som det fanns någon form av övergripande formspråk för Android -telefoner.

Utseendet och känslan hos Android har utvecklats ständigt sedan dess, ofta med babysteg framåt, men ibland med stora steg framåt, som inträffade med introduktionen av Material Design under 2014. Android 12 ger oss plattformens tredje stora, allomfattande redesign i form av Material du - ett ambitiöst försök att göra Android mer personligt, med individuella färgscheman plockade från materialpaletten.

När vi går in i den fjärde designtiden för Android - efter de första dagarna, Holo och Material Design - är det dags att besöka de senaste 13 åren i Android UI och komma ihåg hur vi kom hit.

Källa: Android Central

Källa: Android Central

Under de första två åren av sin existens saknade Android någon stark designriktning. Från Android 1.0 till 2.2 Froyo beskrivs utseendet och känslan av operativsystemet bäst som generiskt, funktionellt och intetsägande. Det verkade hämta inspiration från dåtidens gamla smartphones, det tidiga Android-utseendet bestod av klumpiga ikoner, graderade menyer och en hel del grått.

Utseendet och känslan av lager Android spelade inte så stor roll.

Den här krusiga estetiken var vettig för de små, lågupplösta smartphone-skärmarna i slutet av 2000-talet. Medan Google vid denna tidpunkt (typ) skickade telefoner, i form av T-Mobile G1 och så småningom Nexus One, mest konsumenter skulle uppleva Android genom linsen på en alltförtärkande tillverkarhud som HTC Sense eller Samsung TouchWiz. Utseendet och känslan av stock Android spelade bara inte så stor roll när bästa Android -telefoner använder inte något nära det.

Men när man ser tillbaka på programvaran för T-Mobile G1 finns många av de viktigaste, igenkännliga Android-designelementen i dag. Flersidiga startskärmar med widgetstöd, applådan och aviseringsmenyn är alla där, även om de är insvept i ett användargränssnitt som mer liknar ett 90 -talets stationära dator -operativsystem än Android i dag.

Googles lansering av Nexus One -smarttelefonen sammanföll med några mindre designjusteringar till Android 2.1 Eclair, som innehåller snabba genvägar till telefonappen och webbläsaren tillsammans med applådans ikon. Den första Nexus-telefonen fick också ett snyggt 3D-animerat appnät. Men i grund och botten var detta lager Android fram till slutet av 2010: ganska tråkigt, kallt och nyttigt.

Källa: Android Central

Ankomsten av ex-Palm-designern Matias Duarte till Google-först som designchef för Android, sedan för hela företaget-satte kursen för Androids användargränssnitt under det följande decenniet.

Duarte anställdes precis innan Google skulle skicka Android 2.3 Pepparkakor och Nexus S -telefonen, så hans inflytande på Pepparkakor var begränsat. Ändå var Android 2.3 den mest betydelsefulla designreparation Android någonsin sett, med mörkare färger genomgående i en nick till den ökande populariteten för OLED -skärmar. De Android grön nyans användes som accentfärg för att markera ikoner, och menypressar skiljdes med orange blinkar. Annars var detta en fortsättning på den gamla Android-versionen.

Ankomsten av den första tablettspecifika versionen av Android förändrade allt, med Duartes inflytande tydligt i början av 2011 års Android 3.0 Honeycomb-release. Honeycomb drev tidiga iPad-rivaler och hade ett djärvt sci-fi-gränssnitt med en blå och djuplila färgpalett.

Denna version introducerade oss för tangenter på skärmen, navigationsparadigmet som finns kvar med Android till denna dag på vissa telefoner. Genom att göra bort den gamla menyn och sökknapparna från pepparkakor och tidigare versioner kan Honeycomb -enheter navigeras med tre virtuella navigeringsknappar: hem, tillbaka och senaste appar. Genom att trycka på den senare startade Androids nyligen upprustade uppgiftsväxlare och visar en liten förhandsvisning av körande appar i en rullbar lista.

Honeycomb, rusade till marknaden i ett försök att bekämpa iPad, fungerade som en slags prototyp för vad kom senare 2011: Android 4.0 Ice Cream Sandwich och det nya "Holo" formspråket - kort för holografisk.

Källa: Alex Dobie / Android Central

'Vad är själ av Android? '

Matias Duarte dök upp på scenen vid lanseringseventet i Hongkong för Google och Samsungs nya Galaxy Nexus, den första telefonen som kör Android 4.0, för att prata Holo.

Duarte berättade för deltagarna att när Google försökte lägga grunden för det närmaste halva decenniet av Android, frågade det sina användare vad Android betydde för dem. Den fann att 2011, "medan människor gillar Android, behöver människor Android, det gjorde människor inte kärlek Android. "

Och så frågade Google sig för första gången "vad är det själ av Android? "

"Android är förtrollande. Något vackert, förföriskt, något man verkligen kan bli kär i. Android är enkelt. Det förenklar alla delar av mitt liv. Och Android borde få mig att känna mig kraftfull och smart, säger Duarte till deltagarna. Det nya Android -gränssnittet, med sitt Holo -tema, var tänkt att exemplifiera dessa värden.

Holo byggde på det som hade startats i Honeycomb -utgåvan och lade till det nya Roboto -teckensnittet, ett typsnitt som förblir standard på de flesta Android -enheter idag. Till skillnad från Droid Sans, som den ersatte, byggdes Roboto för högdensitetsskärmar som började bli vanliga vid den tiden, vilket gav ett mer modernt utseende och trevlig läsupplevelse. På andra håll var de fasade kanterna och präglade knappar och menyer utskurna från Android, ersatta med enklare, mer geometriska ikoner och UI -möbler.

Källa: J4lambert, CC BY-SA 4.0, via Wikimedia Commons

Holo Blue (a.k.a #33B5E5) var den primära accentfärgen på Glass Sandwich och den efterföljande Jelly Bean -utgåvan, vilket fick Android 4 att verka skarp och futuristisk, men tydligt mindre tron-påverkad än honungskaka hade varit. Den mörkare färgpaletten från Android 2.3 och 3.0 förblev dock och verkade passa bra för Galaxy Nexus, särskilt med den expansiva, kontrast-tunga AMOLED-skärmen.

De flesta stora Android -tillverkare skulle dock fortsätta att göra sina egna saker. De som Samsung, HTC och LG putsade återigen Android med sina egna anpassade gränssnittsskikt, som ofta kör grovt över Holo i ett försök att differentiera sina produkter. Som ett resultat såg en Samsung -telefon som kör Gingerbread ut ungefär som en Samsung -telefon som kör Ice Cream Sandwich. Till exempel, på Galaxy S3, den första stora Samsung-handenheten som lanserades efter den co-branded Galaxy Nexus, måste du titta verkligen svårt att se något av arbetet från Duarte och hans team.

Tidigt Holo var dock ett ganska meningsfullt designspråk som inte lätt kunde vara gift med ett företags egna designpreferenser. I skarp kontrast till en av kärnprinciperna i Material du, den särpräglade Holo-blå var hårdkopplad till Holo-temat, utan något sätt att ändra det på Android-enheter i lager.

Android 4.4 KitKat tämde Holo något, ersatte blå accenter med ljusare vita, vilket ger en bättre passform tillsammans med appar, tapeter och ikoner med en mer varierad färgpalett. Och detta skulle så småningom gå in i det andra stor stor Android -design som inträffade i slutet av 2014.

Källa: Android Central

Vid utvecklarkonferensen för Google I/O 2014 i San Francisco presenterade Matias Duarte, i sin nya roll som VP för design för hela Google, den nya Material Design språk.

Material Design var "en konsekvent vision, för mobil, stationär dator och därefter", säger Duarte. Precis som Holo hade anlänt i tid för de högre upplösta mobilskärmarna från början av 2010-talet, Material Design utnyttjade den förbättrade grafiska hästkrafterna för den mobila hårdvaran som är tillgänglig i mitten av det årtionde. Men det var inte bara för telefoner - Material Design skulle leva på surfplattor, smartklockor, Chromebooks och webben.

"Vi ville ha en design som var tydlig och enkel, och som människor intuitivt skulle förstå," förklarade Duarte. "Så vi föreställde oss: tänk om pixlar inte bara hade färg, utan också djup? Tänk om det fanns ett intelligent material som var så enkelt som papper, men som kunde förvandla och ändra form som svar på beröring? "

Källa: Phil Nickinson / Android Central

'Tänk om det fanns ett intelligent material som var så enkelt som papper, men kunde förvandla och ändra form?'

"Digitalt papper" var kärnan i den ursprungliga visionen för Material Design: UI som liknade ett ark papper, med subtila skuggor för att förmedla djup, samtidigt som du kan expandera, ändra storlek, kombinera och överföra som behövs. Varje yta i en Android -app kan nu ha ett höjdvärde, med Android -ramverket på lämpligt sätt att ge belysning och skuggor under detta digitala papper.

Materialdesign presenterades som enkel, geometrisk och skiktad, med en djärv färgpalett och härliga animationer. Enkelt blomstrar som en uppspelningsknapp som delas upp i en pausikon när den trycks eller kontaktikoner expanderar till visa när de laddar ställa in en Material -app bortsett från det tidigare Holo -designspråket och förbli en del av Android i dag.

Den ursprungliga Material sizzle-rullen visade detta tillsammans med mycket livfulla nyanser och lagertunga appar med snygga animationer som aldrig var fullt insåg när designspråket gick live i Android 5.0 Lollipop. Den verkliga implementeringen av Material slutade med att bli mer konservativ, eftersom Googles ingenjörer försökte få företagets stora laddning av Android-appar Material-redo. Android var ett stort skepp att styra, och "materialisering" av operativsystemet och dess appar blev en flerårig process.

Materialdesign i Android Lollipop introducerade dock flera viktiga designelement som varade i mer än ett halvt decennium: Den flytande åtgärdsknappen var nyckelfunktionerna för att gå till platsen, till exempel att starta ett nytt meddelande i en sms-app eller lägga till ett objekt i en lista. Och utskjutbara "hamburgare" -menyer framstod som ett favorit sätt att navigera mellan de viktigaste områdena i appar. Och knapptryckningen och överflödet blomstrar som debuterade med Material Design i Android 5 fastnat hela vägen till Android 11.

Och med att Google har mer kontroll över Android -ekosystemet - och det nya formspråket är mer öppet för anpassning - Materialdesign införlivades lättare i tillverkarnas Android -skinn jämfört med Holo.

Material Design var alltid avsett att röra sig med tiden.

Materialdesign var dock aldrig avsedd att vara en statisk uppsättning riktlinjer, och den fortsatte att utvecklas i efterföljande Android -versioner. Android 6 Marshmallow -utgåvan 2015 svängde bort från de mättade färgerna vi hade sett i den första materialpresentationen. Menyn Senaste appar i Rolodex-stil avvecklades så småningom i Android 9. Och navigationsmenyerna "Hamburger" krockade med Android 10: s navigationsnavigering och har nu dragits tillbaka från många appar.

Källa: Alex Dobie / Android Central

År 2016 debuterade Google sina första Pixel -telefoner, vilket ledde till en ytterligare utveckling inom materialdesign och en avvikelse från den ursprungliga 2014 -visionen. När efterföljande pixlar kom, försökte hårdvarutillverkaren Google att differentiera sin telefonprogramvara ytterligare. Google -appar blev mindre färgglada och drev istället ett rent vitt och blått färgschema. År 2020 hade de flesta kärn-Google-appar som Foton, Gmail, Nyheter och Maps antagit denna "Material Theme" -estetik, tillsammans med iPhone-liknande bottennavigeringsknappar.

Googles appar från 2020 var långt ifrån den färgstarka materialprototypen som visades 2014. Lyckligtvis planerades dock en mer levande materialmakeover för Android 12 år 2021.

Källa: Google

Sju år efter materialdesignens debut var Google I/O -konferensen återigen platsen för ett stort designmeddelande för Android. Och Matias Duarte återvände till scenen i Mountain View, den här gången för att visa upp nästa iteration av Googles designspråk i Android 12 Material du.

"Istället för att formen följer funktion, vad händer om formen följde känslan? Istället för Google blue, föreställde vi oss Material You-en ny design som inkluderar dig som medskapare, så att du kan förändra utseendet och känslan på alla dina appar. "

Källa: Google

"Istället för Google blå, föreställde vi oss Material You."

Magin bakom Material du var ett projekt internt känt på Google som "Monet". Monet kan undersöka din valda startskärm bakgrund, välj nyckelfärger från materialpaletten och använd dem för att anpassa alla appar på din telefon. Mer dämpade nyanser skulle användas för bakgrunder, medan levande, iögonfallande färger kan appliceras på viktiga knappar eller omkopplare.

I motsats till Material Design 1.0: s "Digitala papper" framstår Material You plattare och mer abstrakt. Skikten i UI är fortfarande där, vilket framgår av de överlappande nivåerna av snabbinställningsknappar, meddelandepaneler och gränser när du drar ner Android 12: s meddelandeskugga.

Källa: Google

Men skuggorna och de vassa pappersliknande kanterna på Android Lollipop är borta, ersatta med rundade hörn med breda radier. Även widgets på startskärmen har översynats med rundade hörn. Material Du fungerar också som ett motgift mot de ofta tråkiga Google-appar som användarna hade vant sig med i Android 10 och 11. Android 12, hävdar Google, kan hjälpa dig att välja en anpassad palett som den vet kommer att se bra ut i appar, menyer och till och med widgets på startskärmen. Det är ett mer personligt, mer uttrycksfullt designmönster för vad som trots allt är den mest personliga dator som de flesta äger.

Och medan det gamla trogna Roboto -teckensnittet fortfarande används på platser, framhåller Material You Google Sans, företagets officiella teckensnitt, som ger mer personlighet. Google Sans används överallt, från ikontexter till menyer i appen Inställningar och skalas upp Android 12: s låsskärm för att fylla skärmen med en färgad klocka när det inte finns några väntande aviseringar.

Källa: Nick Sutrich / Android Central

En djärv ny riktning för Android -design, men kommer tillverkarna att hoppa ombord?

Den animerade blomstrar i Material Du är också en naturlig utveckling av tidig materialdesign. Ambient Display -klockan vaknar till liv när telefonen tas upp, blir djärvare och färgad. Och beroende på hur du låser eller låser upp din telefon ser du en animerad aura som åtföljer handlingen.

Material du debuterar i Android 12 på Google Pixel -telefoner i slutet av 2021, och det är troligt att vissa andra tillverkare kommer att införliva det i sina Android -skal samt uppdateringar. Men precis som det var med Holo och Material Design finns det ingen garanti för att telefontillverkare kommer att följa Googles ledning. Android 12-användare måste också vänta på att utvecklare ska uppdatera sina appar för att stödja Material You: s palettbyte. Om övergången till Material Design 2014 är något att gå efter kan det ta lite tid.

Det vi har sett om Material You hittills ger dock Android i allmänhet - och Google Pixel -enheter i synnerhet - a stark designidentitet, med ett designspråk väl anpassat till telefoner, klockor, surfplattor och andra smarta ytor på 2020 -talet.

Om historia är någon indikator, kommer vi att checka in igen någonstans runt 2026 för att lära oss vart Material Design är på väg nästa.