Simge Tasarımı Hakkında Bilmeniz Gereken Her Şey

Yayınlanan: 2020-08-27

Simge Tasarımı Hakkında Bilmeniz Gereken Her Şey

Simgeler küçük ama güçlüdür ve bu nedenle simge tasarımını dikkatlice düşünmeniz önemlidir. Tasarımcılar her yerde, iyi bir ikon yaratmaya giden yaratıcılığın ve çabanın miktarına tanıklık edecekler. Bunun nedeni, aynı zamanda etkileyici ama aynı zamanda basit olması gerektiğidir.

Simgeler üzerinde bir arka plan

Bir simge tasarımı aslında sadece bir nesneyi veya bir programı temsil edecek küçük bir görüntüdür. Güçlü bir mesaj ileten gerçekten basit görüntülerdir. Simgelerin genellikle hatırlanması çok kolaydır ve aynı zamanda hemen hemen tüm grafik arayüzlerin ana özelliğidir.

Eğlenceli Bilgi: Simge kelimesinin kökeni, görüntü anlamına gelen Yunanca 'eikona' adlı eserden gelir. Macintosh ve Microsoft gibi ilk GUI işletim sistemleri çıktığında dijital simgeler ortaya çıkmaya başladı.

Farklı simge türleri nelerdir?

Bilmeniz gereken üç ana simge türü vardır. Aşağıda, her biri ve kullanıcı deneyimine getirdikleri etki türü hakkında bazı bilgiler verilmiştir.

Evrensel simgeler

Bunlar evrensel olarak tanınan simgelerdir. Örneğin arama, yazdırma, ev veya alışveriş sepeti simgeleri bu tür simgelerdir. Ama sadece küçük bir sorun var. Evrensel simgeler oldukça nadirdir. Nadir derken, burada verilen örnekler dışında, çoğu simgenin belirsiz olduğunu ve arayüze bağlı olarak anlamlarının değişebileceğini kastediyoruz.

boşluk
Farklı anlamlara sahip simgeler

Adından da anlaşılacağı gibi, bu simgelerin onları çelişkili veya çelişkili hale getirebilecek birden çok anlamı vardır. Örneğin, bir kalp ve bir yıldız olan simgeler çelişkilidir. Bu iki simgenin işlevselliği bir uygulamadan diğerine değişir ve bazen birbirleriyle rekabet edebilirler. Bu nedenle, bu simgelerin kesin olarak yorumlanması oldukça zor hale gelir. Bir uygulamada bile, kullanıcı belirli bir sonucu umarak üzerlerine tıkladığında ve bunun yerine başka bir şey aldığında, bu semboller kafa karıştırıcı hale gelebilir.

boşluk
Benzersiz simgeler

Bir simge kullanarak benzersiz bir nesneyi veya eylemi nasıl tanımlayabilirsiniz? Benzersiz bir simge tasarımı kullanma. Ancak bunun başarısız olduğu birçok örnek olduğunu not etmek önemlidir. Örneğin, Apple oyun merkezlerini bir grup renkli daire aracılığıyla temsil etmeye karar verdiğinde anlam kayboldu. Bu daireler ne anlama geliyor ve oyun merkeziyle nasıl bir ilgisi var?

boşluk

Hangi simge biçimlerini kullanabilirsiniz?

Bir simge tasarımı istediğinizde bilmeniz gereken birkaç simge biçimi türü vardır.

  • SVG – bunlar Ölçeklenebilir Vektör Grafikleridir ve mükemmel temel formatı sağlar. Ölçeklenebilir olduğu için, temelde kaliteden ödün vermeden simgenin boyutunu değiştirebileceğiniz anlamına gelir.
  • PNG – Tam uyumluluk istiyorsanız, Taşınabilir Ağ Grafiği formatı tercih edebileceğiniz seçenektir. Bu, piksellere dayalı olduğu ve kaliteyi etkilemeden yükseltme yapamayacağınız anlamına gelen bir raster biçimidir. PNG, Word, PowerPoint ve e-postalarda çalışır. Herhangi bir renkli arka planın üzerine düzenleme yapılmadan eklenebilirler.
  • ICO – Microsoft Windows simge biçimi, simgenizi herhangi bir Windows uygulaması için veya hatta kendi web siteniz için bir favicon olarak kullanmak istiyorsanız harikadır.
  • ICNS – bu biçim çok özel amaçlar için kullanılır. Bu, uygulamaların yanı sıra Mac OS X belgeleriyle de kullanılabilen Apple'a özgü bir biçimdir.

Kimp İpucu: Simge tasarımınızı olabildiğince basit tutun. Tasarımınızda, amaçlanan anlamı açıkça temsil eden gerçek dünya öğelerini kullanmaya çalışın. Örneğin, finansmanı belirtmek için bir çubuk grafik kullanabilirsiniz. İş demek için bir iş çantası kullanabilirsiniz. Tasarımcınızın doğru simgeleri bulmasına yardımcı olmak için onlara olabildiğince çok bağlam verin. Simgelerinizin nasıl kullanılacağını tam olarak bilmelerini sağlayın.

Bir simgeyi etkili veya etkisiz yapan nedir?

Artık simgelerin biçimleri ve simgelerin türleri hakkında bir fikriniz olduğuna göre, etkin veya etkisiz bir simgeyi neyin oluşturduğuna da bakalım. Bu sayede tasarımcınızla çalışırken bu özellikleri göz önünde bulundurabilirsiniz.

netlik

Bir simge tasarımı, gördüğünüzde hemen bir mesaj iletmelidir. Simgenizde kullandığınız metafor bilinmiyorsa veya belirsizse, bunun ne anlama geldiği konusunda insanların kafası karışacaktır. Örneğin, Ev için kullanılan simge herkes tarafından bilinir – bu netliktir. Şimdi, Ev simgesinin ortasında bir nokta bulunan bir daire olarak tasvir edilmesi durumunda ne olacağını hayal edin? Bu kafa karıştırıcı yapar değil mi? Kafa karıştırıcı simgeler etkisizdir.

okunabilirlik

Netlik faktörünü sıraladıktan sonra artık simgenin kolayca okunabilir olduğundan emin olmalısınız. Aşağıdaki örneğe bakarsanız, ilk simgeyi anlamak zordur çünkü ayrıntılar çok incedir ve bu da onu bulanıklaştırır. Doğru yapılmış küçük simgelere iyi bir örnek, mükemmel okunabilirliğin olduğu Google haritalarında olanlar olabilir. Daha ince vuruşlar kullanmak, yeterli boşluk bırakmamak ve küçük simgelere çok fazla ayrıntı eklemek, okunabilirliği kaybettiği için onları etkisiz hale getirecektir.

boşluk
Simgenin hizalanması

Bir ikon tasarımı bir denge duygusuna sahip olmalıdır ve bu, tüm unsurları optik olarak hizalayarak elde edilebilir. Bu, tasarımın, izleyicinin öğeleri nasıl algılayacağına göre hizalanması gerektiği anlamına gelir.

boşluk
Bir simgenin kısalığı

Simgenin kısalığı, eklediğiniz ayrıntı miktarına göre belirlenir. Simgelerinizi olabildiğince basit tutun ve okunamaz ve bulanık hale getirecek gereksiz çizgi ve ayrıntılar eklemekten kaçının.

Tutarlılık

Bir uygulama veya belirli bir arayüz için simgeler için tasarım yapıyorsanız, tüm simgelerinizin aynı tutarlılığı koruduğundan emin olun. Bazı simgeler diğerlerinden daha ayrıntılı veya daha keskin görünüyorsa tutarlılığı kaybedersiniz. Bu, arayüzün kullanıcı deneyimi açısından acı çekmesine neden olacaktır.

Tasarımın kişiliği

Yine, tasarladığınız arayüz veya uygulama ile her bir simgenin markanın kişiliğini temsil ettiğinden emin olmalısınız. Ne tür bir marka stiliniz ve sesiniz olduğuna bağlı olarak profesyonelden eğlenceli ve tiki olana geçebilirsiniz. Bu, simgeleri tasarlarken tasarımcınıza vermeniz gereken brifingin çok önemli bir parçasıdır.

Simgenizin kullanımı kolay olmalıdır

Çizim 't' harfine yapıldıktan sonra bile simge tamamlanmış olmaktan çok uzaktır. Tasarımcınızın yaptığı simgenin, müşterilerin onu kullanmasına izin vermeden önce test edilmesi ve hazırlanması gerekir. Bu test ve hazırlık, simgenin kullanımının kolay olmasını sağlayacaktır. Kullanımı kolay bir simgenin işaretleri şudur:

  • İyi organize edilmiş – burada tasarımcınızın tasarım için ana dosyaları iyi organize edilmiş bir şekilde yerleştirdiğinden emin olmanız gerekir, böylece daha sonra gerekirse bunlara başvurabilirsiniz. İhtiyaç duyduğunuzda kolayca bulunabilmeleri için alfabetik sıraya veya başka bir sıraya konmalarını isteyebilirsiniz.
  • İyi belgelenmiş – tasarımcınızdan ikon ailesinin temel ilkelerini iletmesini ve ayrıca teknik kuralları düzenlemesini isteyin. Ayrıca, bu belgeleri tamamlandıktan sonra herkese açık hale getirebilirsiniz, böylece insanlar isterlerse başvurabilirler.
  • Test edildi – bunu tasarımcıyla birlikte yaptığınızdan emin olun. Tutarlılıklarını ve sahip oldukları alakayı görmenize yardımcı olacak şekilde tasarlanan tüm simgeleri yan yana yerleştirmelerini sağlayın.
  • Simge yöneticisi gibi özel araçlar tarafından desteklenir. Simgelerin kullanımına yardımcı olacak herhangi bir özel araç sağlayabiliyorsanız, bunları erişilebilir hale getirmelisiniz.

Simge tasarımı için özetiniz neleri içermelidir?

Tüm kullanım durumlarını göz önünde bulundurun

Simgelerinizin nerede kullanılacağını ve neyi temsil etmeleri gerektiğini bilin. Ayrıca hangi simgelerin bir metafora ihtiyaç duyacağı ve hangi simgelerin gerçek hayattaki nesnelere dayalı olarak yapılacağı arasında ayrım yapmanız gerekir. Bu faktörleri netleştirdikten sonra, bunu brief aracılığıyla tasarımcınıza iletebilirsiniz.

boşluk
Beyin fırtınası kavramları ve metaforları

İlk olarak, simgeyi mümkün olan en iyi şekilde tanımlamak için kullanılabilecek tüm tasvirlerin bir listesini yapın. Kelime kümeleri ve sözlükler gibi kaynaklar, simgeler aracılığıyla iletmek istediğiniz anahtar kelimeler, benzer kelimeler ve kavramın tanımları gibi şeyleri bulmanıza yardımcı olur. Daha sonra, (soyut ve basit olması gereken) simgenin mesajı net ve etkili bir şekilde göndermesi için bu fikirleri basitleştirmeye başlayabilirsiniz. Mümkün olduğunca çok araştırma ve beyin fırtınası yapmaya çalışın ve ardından geri kalanı için tasarımcınızın desteğini alın.

Yararlı referanslar bulun

Kaliteli referanslar bulmak için her zaman araştırmaya yatırım yapın. Muhtemelen bir yerlerde birileri, tasarlamak istediğiniz simgenin harika bir versiyonunu zaten yapmış olabilir. Bunları bulabilirseniz, ilhamınızı da bulabilirsiniz. Bu referansları tasarımcınıza sağladığınızda bakış açınızı daha kolay anlayacaktır.

Simgenin stilini seçin

Popüler olan stillerden bazıları glif, düz, anahatlı, malzeme ve elle çizilmiştir. Stile son verdiğinizde, iki önemli faktör hakkında düşünmeniz gerekecek. Bunlardan biri, bunların görüntüleneceği UI arayüzü ve stili olacaktır. İkincisi, Malzeme veya iOS gibi, bu arabirim için gereksinimler olacaktır.

Tasarımcınızla ayrıntılı olarak tartışın

Tasarımcınızın, tasarladığınız tüm simgeler arasında tutarlılığı koruduğundan emin olun. İşleri daha net hale getirmek için, yapılacak tüm simgelerin tam bir taslağını yapmalarını sağlayın.

İkonlarınızın konsept çizimlerini onayladıktan sonra vektörel versiyonlarını talep etmelisiniz. Son olarak, çeşitli kullanım durumlarınıza uygun olup olmadıklarını görebilmeniz için simgelerinizin bazı maketlerini alın.

boşluk

Şimdi, simgelerinizin keskin görünmesi için brifinginize eklemeniz gerekenleri gözden geçirdik. Şimdi, nihai sonucunuzun tam olarak net olması için, tasarladığınız simgelerde somutlaştırılması gereken ana şeyleri gözden geçirelim. Bunları tasarımcınızla tartıştığınızdan emin olun.

Yeni simgeler oluşturmak için kontrol listesi

Aşağıda açıklanan adımlar, simge tasarımınızı oluşturmak için tasarımcınız tarafından gerçekleştirilecektir.

Bulanık simgelerden kaçının

Simgelerin keskin, keskin ve geniş görünmesi için pikseller üzerinde konumlandırılmaları gerekir. Bu, bulanık hıçkırıklardan kurtulacaktır.

Boyutları ve ağırlığı kontrol edin

Tüm simgelerinizin aynı ağırlık ve boyutlara sahip olduğundan emin olmak için şaşılık testini kullanmanızı öneririz. Temel olarak, sadece şaşı ve simgelerinizin birbirine göre nasıl göründüğüne bir bakın. Herhangi bir ayarlama gerekiyorsa, tasarımcınızdan yardım aldığınızdan emin olun. Buradaki bir ipucu, ağırlığın simge kümenizde aynı olduğundan emin olmak için mükemmel bir daire ve kare kullanmaktır.

boşluk
Geometrik şekilleri kullanma

Tasarımcınıza, simgelerinizi çizmesi için basit ve sağlam geometrik şekiller kullanmasını sağlayın. Bu, simgeleri netleştirecek ve estetik açıdan çekici görünecek.

Aşırı detaylandırmadan kaçının

Tasarımcıyla birlikte gözden geçirdiğinizde, simgelerinizi meşgul ve ağır gösteren tüm ayrıntıları kaldırın. Bunun yerine, simgelerin temiz ve net görünmesini sağlayacak yalnızca temel ve basit ayrıntıları koruyun. Simgeler küçüktür ve çok fazla ayrıntı içeren bir bloğa dönüşebilirler.

Yer tutun

Bir simge içindeki tüm ince ayrıntıların nefes alma alanına ihtiyacı vardır. Hepsi birbirine çok sıkı yapışırsa, tüm tasarımı çamurlu hale getirecekler. Simgelere baktığınızda, ayrıntıların netleşmesi için hepsinin yeterli alana sahip olup olmadığına ve anlamlarının hemen sizin için net olup olmadığına bakın.

Simgelerde kontrast

Simgelerde yeterli renk kontrastı olduğundan emin olun. Siyah beyaz dengesi tam yerinde olmalı. Yeterli kontrast yoksa simgeler belirsiz görünecektir.

boşluk
Görsel birliğe bakın

Bakmanız gereken diğer bir faktör ise bir ikonun görsel birliği olarak adlandırılır. Bunun temel olarak anlamı, çizgilerin ağırlığının, köşelerin boyutlarının, kullanılan renk paletinin, dahil edilen ayrıntıların düzeyinin ve tasarım öğelerinin tüm simgeler kümesi boyunca tutarlı kalmasıdır. Takip edilmesi gereken çok şey olduğu için tasarımcınızla bu konuda sohbet ettiğinizden emin olun!

Simge tasarımı eğlencelidir, ancak doğru olması zordur

Simge tasarımına başlayabilmeniz için sizi birçok bilgiden geçirdik. Almak ve kendinizi alıştırmak çok fazla, bu nedenle simgelerinizi tam olarak doğru bir şekilde elde etmek için iyi bir tasarımcıyla çalıştığınızdan emin olun. Simgelerinizin nasıl kullanılacağını ve onları kimin görüntüleyeceğini anlamaları için ihtiyaç duyacakları tüm ayrıntıları sağlayın. Ve çok yakında, güçlü, net ve kullanımı kolay tasarlanmış harika bir simgeler setine sahip olacaksınız.