Share
Ikoner är en viktig del av varje iOS-applikation. De förmedlar förstahandsintrycket av din app till potentiella användare och förblir en central kontaktpunkt för dem som hämtar programmet. Vi vet alla hur viktigt det är att skapa ett bra första intryck och bygga ett starkt varumärke med din design, och denna handledning kommer att visa 8 fantastiska sätt att göra just det!
Detta är en no-brainer i ikondesign, men om du går igenom App Store finns det överraskande få ikoner som gör det bra. Sök till exempel "tongue twisters" och du kommer att se ett urval av ikoner så här:
Om du tog bort alla orden av dessa ikoner, hur många skulle säga till dig "tunga twister"? Det här är anledningen till att du ofta hör "använd inte ord på ikoner" - för många använder den som en kryck för att beskriva vad appen handlar om!
Jag har förstorat den enda ikonen som verkligen betyder ordet "tunga twister" rättvisa. Några förbättringar som jag föreslår är att skissera huvudets silhuett och möjligen göra det större. Detta kommer att göra den sneda tungan tydlig synlig och konturen hjälper till att dyka upp i bakgrunden. Om inte alla twisters är specifika för Storbritannien, skulle jag förlora flaggan och istället välja en bakgrund som lägger till mer kontrast runt illustrationen.
Starbucks primära app har en bra ikon och appdesign, men appen som spårar pengar på ditt Starbucks Presentkort pales i jämförelse. Ikonen är knappt läsbar i App Store-nätet och logotypen är praktiskt taget osynlig.
Vad mer kunde de ha gjort? Vad sägs om att ikonen liknar ett verkligt presentkort? Dra in varumärket grönt, gör logotypen stor och synlig, och lägg till magnetkortet "presentkort" som går över det? Eller kanske en illustration av en plånbok med Starbucks logotyp?
Ett annat sätt att lägga djup i din ikon och appdesign är att ge det lite konceptuellt djup. I det trånga utrymmet för "att-göra" -apps, är "check" -markeringen en fin visuell metafor för "gjort" men är överdriven till meningen med meningslöshet.
De enda appar som står ut från mängden har lagat ett extra konceptuellt lager över det kommunikativa kontrollpanelet.
2Do - Den här ikonen liknar en stack med dokument som behöver granskas. Det sydda läderet är en fin kontrast till den rena, post-it-sedelfärgen och den släta strukturen.
Sätta av saker - Att sätta saker på är ett bra exempel på konceptuellt tänkande och design. Varför skapa en annan att göra-app när de flesta av oss verkligen vill ta reda på vad vi kan sätta av förrän imorgon? Titta på ett problem i exakt motsatsen till din tävling kan ge några ganska kreativa och roliga resultat. I konstverket står exakt vad appen handlar om - en inkorg med en "framåt" -pil, och om du tittar på rutnätet över ikonerna ovan väljer färgvalet att det verkligen skiljer sig från mängden.
Taska - Taska's ikon ser ut som en massa papper som är snyggt staplade på ett skrivbord. Även om det inte är ett djupt koncept, är denna ikon vackert illustrerad. Lägg märke till detaljerna om skuggningen av träbakgrunden som ger djupet på stapeln och skarpa på kanterna på papperet och kryssrutan. Papporna verkar dra direkt från skärmen vilket gör att den dyker upp från nätet av inaktuella kontrollmarkeringar.
Din appikon är det första löftet du gör till användaren. Det står:
Om folk ser en högkvalitativ ikon och appen är skit, får folk PO'd. Om folk tror att ikonen betyder "x" och appen faktiskt utför "y" får folk PO'd. Uppfyll din apps löfte till användaren!
Ett sätt att säkerställa att du levererar dina löften är att se till att grafiken i appen matchar ikonen. Utgifter är ett utmärkt exempel på en ikon som mycket precist beskriver appens funktion (spårningskostnader) och hur man drar av ett konceptkoncept från ikon till app.
Detta är en överraskning för många designers nya för att designa iPhone och iPad ikoner. Det sätt på vilket din design ser ut i munnen i Photoshop eller ens i iPhone Simulator är mycket annorlunda än hur den kommer att se ut på en verklig enhet. Varför? Några anledningar:
All-in Yoga är ett utmärkt exempel på en provocerande, men smakfullt illustrerad siluett som grundligt beskriver vad appen handlar om.
All-in Yoga
Om du utformar en app för ett välkänt varumärke, använd det! Nedan följer exempel på appar som gör ett bra jobb att sticka ut i App Store genom att visa en igenkännbar logotyp, namn eller ansikte som är relaterat till appen. Dessa appar kanske inte berättar precis vad appen gör, men det ger en uppfattning om innehållet du kommer att få baserat på bilden.
Nike - förmodligen något fitnessrelaterat
NBC Nightly News - nyhetsprogram från programmet
madonna - musik eller videor
Jamie Oliver - recept
Mad Libs - förmodligen en appversion av MadLibs?
Oavsett vad du gör, slösa inte gåvan till ett igenkännligt märke! Dessa kan vara igenkännliga när de blåses upp:
Men se vad som händer när deras svaga silhuetter tävlar med andra ikoner i det upptagna App Store-nätet. Var är Rachel? iCarly?
Titta nu på förbättringen med bara några små tweaks:
De är också mer identifierbara i App Store-nätet:
Tänka igenom och genomföra dessa tweaks tog mindre än en timme i Photoshop:
Rachel Ray - Även om Rachels ansikte inte var igenkänt, har hon ett bra leende och ögon som fungerar som en kontaktpunkt för att dra in människor. Den goda nyheten när du utformar en ikon för en kändis är att du har mycket att arbeta med för att använda det personens ansikte. I allmänhet är människans ögon först tillverkade mänskliga ansikten bland en grupp generiska ikoner. Testa detta själv: se bort från ovanstående bild en minut och se sedan tillbaka. På vilken ikon tog ditt öga land först? Låt mig veta i kommentarerna!
iCarly - Visst, jag tittar inte på iCarly, men sunt förnuft berättar att showens huvudkaraktär är förmodligen det bästa ansiktet på funktionen på denna ikon, tillsammans med dess tweeny show-logotyp. Om barn eller föräldrar inte är säkra på den utvalda rånan, stöder logotypen att de har hittat en app av intresse.
Eckart Tolle - Denna app är egentligen för hans videoserie, Stillness Within. Titeln kan säkert skrivas över botten på ett elegant sätt. Men för folk som känner igen Eckart, kommer de förmodligen inte att bry sig om titeln. Han lockar en mycket passionerad publik, en som skulle vara intresserad av allt han publicerar. Att bara ha sin bild är nog.
Hello Kitty Stamp Calendar - Återigen, mycket igenkännligt märke som har för mycket förpackat till ett litet utrymme. I originalversionen kan du knappt ta fram Hello Kitty-ansiktet. Detta är synd eftersom det är det internationellt erkända varumärket för varumärket. Naturligtvis skulle ett värdefullt tillägg vara att lägga till en stämpelformad kalender, men vad som måste beaktas vid stora märken är hur man hanterar ikonografi över hela paketet av appprodukter för det varumärket. Är det den enda app Hello Kitty kommer att producera? Hur hanterar de ikoner för varumärket som helhet?
Perez Hilton - Den här ikonen kan gå i ett par olika riktningar. Känner hans läsare verkligen honom eller bara hans namn? Jag har läst hans blogg några gånger och kan inte berätta något om hans utseende. Men han har några illustrationer på hans blogghuvud, problemet är det som användes är praktiskt taget oigenkännligt. Jag använde en av de andra illustrationerna på hans blogg, blåste upp den för en stark silhuett och matchade de höga färgerna på hans hemsida. Bam.
Nu när jag har sagt att det är bra att använda en bildbild, låt mig klargöra. Detta är ENDAST OK om du har att göra med en igenkännbar kändis-typ siffra! Jag skulle inte rekommendera att använda fotografier av någon annan anledning. Nedan följer några exempel på dålig användning av fotonikonen:
Du kanske har märkt att jag fortsätter att hänvisa till App Store-nätet. Det här gör ikondesignen för iPhone och iPad unik från skrivbords- eller webbapplikationsikondesign. Handelshögskolan App Store är som att leta efter en "hitta" på en butik. Det finns några användbara och vackert designade produkter omgivna av mycket skräp och skräp.
"Rutenettet" gäller iTunes Store, iPhone och iPad butiker, så var noga med att testa hur din ikon kommer att se ut i alla dessa miljöer, när den står i motsats till appar som sannolikt kommer att placeras i samma lista som din. Du måste räkna ut hur man ritar användarens öga bort från tävlingen och mot dig!
Lämna mig en kommentar nedan med exempel på ikoner som du tror får det rätt!
Accentsconagua