Vill ni göra ett stort ikonpack?

Som jag har förstått det så är det först och främst för att anpassa ikoner som man INTE custom gjort, så att stock-ikoner ändå ska passa in i temat. Dvs, om man bara skulle använda den metoden så kommer alla ikoner att anpassas efter masken. Man kan visserligen lägga till en eller flera ikon masker, men det är risk att en del ikoner kommer se ganska illa ut.

Det betyder att man ändå måste göra sina "färdiga" ikoner som är klara 96x96 med filter osv.

Dessa läggs in i det tema man skapat, och det behövs en xml rad för varje klar ikon.

Om man låter ikon masken skala alla ikoner som är 512x512 istället för en klar ikon som är 96x96, kan man då använda den som en lös ikon för andra launchers, eller för de dom bara vill använda enstaka ikoner?


Sent from my HTC One X

 

OK, då hade jag fel. Men tror fortfarande att 96x96 är lite litet med alla 1080p-mobiler i åtanke. Röstar på 128x128.

 

128x128 it is then

Funderade på en sak, storleken på ikonen är ju oftast inklusive bakgrunden, vilket gör att själva bilden blir 96x96 (el. 128x128), men egentligen blir ju ikonen något mindre. Är kanske så det alltid blir, men det enda alternativet är väl att ha så lite bakgrund som möjligt?



Sent from my HTC One X

 

Nu är jag inte med riktigt. Om vi delar upp det. Har gjort ett eget exempel.

Bilden är 128x128
Bakgrunden är 108x108 (-10)
Ikonen är 88x88 (-10)



/redigerat

 

Ok, då är jag med. Får jag fråga varför du valt att göra den 108x108, och inte tex 120x120? Blir ju ganska mycket död yta som inte används.

Snygg ikon annars!



Bild 128x128
Bakgrund/ikon 116x116

En variant med större bakgrund..

 

Min skugga tar 7px har jag för mig, så då släppte jag 10px runt om allt. Det är även vanligt att ha en del döyta runt om. Så ser Googles ikoner ut och så gör även de flesta som gör ikonpack (dock inte nödvändigtvis just 10px)

 

Då tycker jag att vi kör på det. Klart!

Ska vi sätta upp några guidelines för hur designen får se ut?

om man tex tittar på exemplet med våra två g+ ikoner så är din variant mer centrerad och ren, medans min går utanför och har lite dropshadow. Här tycker jag att man ska bestämma vilket ben man ska stå på, eller vad sägs?



Det finns ju vissa riktlinjer som tex säger hur långt ut en bild/image/ikon får nå kanten av ikonen tex så här:



I ovan exempel skulle då g+ loggan ha varit innanför fyrkanten. Nu behöver det inte vara som just i det här exemplet, men det är bra så att alla ikoner blir så enhetliga som möjligt. Speciellt om det börjar bli många som bidrar med ikoner.

Sedan vet jag att många använder en färg paljett med ett urval av färger i en viss ton eller vad man ska säga. Detta för att hålla ihop temat, så att det inte blir massa knepiga bakgrunder (tex om temat är lite åt pastell, och så kommer någon med en mörkt senapsgul bakgrund)

Eller så kör man med lite lösare tyglar och det får bli lite mer spretigt, dvs man väljer färger som man tycker passar till sin ikon, eller att bilder får gå utanför ikonkanten.

 

Håller med om att vi måste ha klara riktlinjer. Annars blir dat kaos om många skulle ge sig in i projektet. Färgerna tycker jag ska vara fria. De flesta appar har ju oftast en färg som dominerar gränssnittet på appen, då tycker jag inte att man ska begränsa vilka färger som får användas. Dock fortfarande bara en färg i bakgrunden.

Lösningen skulle kunna vara att varje ikon laddas upp tillsammans med tillhörnde PSD så att andra användare enkelt kan ändra bakgrundsfärgen om den inte skulle falla en i smaken.
Däremot tycker jag inte att ikonerna ska få gå utanför bakgrunden. Tycker man får hålla sig på de där 108x108 px. Sen har jag även en dropshadow, bara en aningen annorlunda sort.

Undantag blir ju såklart spel med invecklade ikoner som täcker hela bakgrunden istället för att ha en enfärgad bakgrund. För övrigt föredrar jag en lite mer clean look, så det inte ser så kladdigt ut och för att det överenssämmer mer med hur hela Androidgränssnittet ser ut. Därför har jag bara lagt en svag vit gradient på toppen och en skugga. Dock är det kanske bara jag. Som sagt så får vi prova oss fram tills vi hittar rätt look.

EDIT: Kom på en regel till. Ingen skugga på ikonen som läggs på bakgrunden. Det räcker med skugga vid bakgrunden. Håller du med?

 

Det var precis det jag menade med mitt exempel på min g+. Den har dropshadow på ikonen mot bakgrund. Tycker också att vi skippar det. Bättre att använda subtila fx som tex inner shadow, för att skapa ett djup, men det ska vara subtilt som sagt

Precis

Är nog med dig där också faktiskt. Får inte bli för mycket.

Kan du dela din psd, så slipper vi uppfinna hjulet hela tiden? Vi kanske kan skicka den fram och tillbaka tills vi hittar det perfekta? Skicka på pm.

 

Känns som att vi är på samma bana. Nu är det bara detaljerna kvar.

Kolla PM.

 

Efter att ha läst igenom hela tråden så märker jag att det är ni som "Ledarna", men när designen är klar så hjälper jag mer än gärna till med många ikoner!

 

Åsiktsinstick: Jag gillar ikonerna med lite av "G:et" utanför fyrkanten istället för att alltid hålla allt innanför. Just när det gäller bokstäver ser det så mycket mindre stelt ut när bokstaven får nå utanför och inte synas helt. Tycker jag iaf

 

Inte alls. Tanken var att allt skulle vara öppet och att alla som ville hjälpa till skulle ha en åsikt om designen, så bara säg till så skickar jag PSDn till dig också.

Alla åsikter uppskattas.

 

gjorde lite nya exempel-ikoner utifrån psd:n du skickade. Gjorde även lite ändringar i mallen (se pm).

Här ett exempel på två olika stilar, beroende på vilken väg man väljer att gå. Eller så kör man på devisen, ser det bra ut så gör det, och då kan man skapa lite friare.



Provade lite olika typer av glow, och för att få ikonen lite mindre platt kan man kanske lägga en highlight för att få lite bevel-känsla. Kan se ut så här:



När jag satte dit g+ loggan så använde jag en grid för att placera den inom ramarna för hur lång man får gå ut (om man nu väljer den linjen). Så här:



Nu vet jag inte om vi ska använda det, men jag gjorde det som ett exempel.

 

Ja, nu har jag ju redan svarat i PM med en ändring, men angående linjerna tycker jag det är en bra idé, dck ligger de fel, men det an vi ju ta när vi städat upp PSDn.

För er som är nyfikna ser mitt senaste förslag ut såhär:

 

Gjort ytterligare justeringar. Det kanske inte syns så mycket men det gör sitt till. Den mask jag har gjort är något mindre rundad din Tobby; men om man vill ha en annan shape så är det bara och ändra.

Ser ut så här nu:



Kom gärna med ros eller ris, så vi vet om vi är på rätt bana, eller om vi är ute och cyklar. Som Tobby sa, det är meningen att alla ska bidra

 

Som jag skrev i PM så får inte hörnen bli för lite rundade då det ska synas på mobilen.

För övrigt så syns inte highlighten på flygplansbilden. Har den hamnat bakom eller är den för svag?

 

Jag kan göra en version med mer rundade hörn. De första ikonerna jag la upp här (som jag lyckades radera) hade samma form som din. Sedan tror jag att det är efter tycke och smak. Jag valde en lite mer fyrkantig form nu, då är aningen less på den klassiska med rundade hörn.

Hur som, jag gör om så att hörnen blir mer rundade och lägger upp nya ikoner ikväll, så kanske andra kan tycka till hur den slutliga formen ska vara

Av erfarenhet från mitt förra ikon-paket, så finns det inga glows eller highligths som fungerar på alla ikoner, utan man måste justera utifrån behov. I fallet med flygplansikonen så har jag inte gjort något alls, utan highligthen ligger med samma effekt som på de två andra. Här måste man gasa lite för att få uppnådd effekt

 

Här kommer ny version med rundare hörn. Återkom med feedback.



I och med att det för tillfället inte finns en outline så blir ikonen för subway surfers blaskig och otydlig. Till höger har jag lagt till outline.

 

Ikonerna ser bra ut på telefon. Men den vita skuggan är alldeles för tydlig.

~ Sent from my Nexus 4 using Tapatalk ~