
Apple
Tek bir mavi anahtarı olan beyaz bir oda.
Apple'ın tasarımı, sadeliğin bir örneğidir: neredeyse beyaz bir zemin, bol beyaz alan ve her eylemi kasıtlı hissettiren tek, canlı mavi bir vurgu. Birincil odak noktası tipografidir—SF Pro, artan boyutla azalan negatif harf aralığıyla, başlıkların aşırı ağır olmadan mimari bir netlik kazanmasını sağlar. Ürün, tasarımın ta kendisidir: büyük ürün fotoğrafları ve yaşam tarzı görselleri hakimken, krom öğeler ince çerçevelere, yarı saydam navigasyona ve ince çizgilere karışır. Bölümler, açık gri bir arka plana karşı tam renkli bloklarla promosyon malzemeleri için dönüşümlü olarak kullanılır ve dekoratif unsurlardan ziyade ölçek değişiklikleriyle ritim yaratır.
Sayfa düzeni, sabit bir maksimum kapsayıcı genişliği olmayan tam genişlikte bir sayfadır; bölümler kenardan kenara uzanır ve metin blokları yaklaşık 980 pikselde ortalanmıştır. Navigasyon, kaydırma sırasında görünen her ürün için ek bir alt klasör içeren tek, sabit bir global çubuktur. Ana düzen her zaman ortalanmıştır: büyük bir ürün adı, tek satırlık bir slogan, iki hap düğmesi ve ardından kalan görüntü alanını dolduran bir ürün resmi. Bölümler, cömert bir dikey ritimle (bölümler arasında 64 pikselden fazla) dikey olarak üst üste dizilmiştir ve #f5f5f7 ve renkli arka planlar dönüşümlü olarak kullanılmıştır. Sayfanın alt kısmı, her biri üzerine yerleştirilmiş metin ve hap düğmesi bulunan bir fotoğraf bloğu olan tam genişlikte hizmet kartlarından (Apple TV+, Fitness+, Müzik, Oyun Salonu) oluşan tek bir yatay satırdır. Yan çubuklar, çok sütunlu içerik düzenleri, asimetrik kompozisyonlar yoktur; her şey ortalanmış, üst üste dizilmiş ve simetriktir.
Fotoğrafçılık, baskın görsel dildir. Ürün fotoğrafları, herhangi bir bağlam olmaksızın, tamamen beyaz veya yumuşak gri bir arka plana karşı çekilir; cihaz, izole edilmiş ve aydınlatılmış bir şekilde yıldızdır. Yaşam tarzı fotoğrafları, genellikle yakın çekim nesnelerle birlikte, tam genişlikte banner'larda sergilenir. Renk geçişleri (pastel mavi, pembe, yeşil), dekorasyon olarak değil, ürün bölümleri için bir arka plan görevi görür. İkonografi minimalist ve çizgi tabanlıdır, 1-2 piksel kalınlığındadır ve metinle aynı gri tonlamadadır. Ürün fotoğraflarının kendisi dışında hiçbir illüstrasyon, soyut grafik veya 3D render kullanılmaz.
Palet
Marka
- Apple Blue
#0071e3— Doldurulmuş işlem düğmeleri, seçili durumlar - her görünümü anlamlı kılmak için az miktarda kullanılan tek etkileşimli kromatik renk. - Link Blue
#0066cc— Vurgulanmış işlem çerçeveleri, gömülü bağlantılar - dolu bir tabletin çok gösterişli olacağı yerlerde Apple Mavisi'nden daha doygun bir renk kullanılmıştır. - Signal Blue
#2997ff— Dekoratif çerçeveler, resim konturları, simge kenarlıkları - sistemdeki en açık mavi renk, kullanıcı etkileşiminden ziyade atmosfer yaratmak için kullanılmıştır.
Doğal
- Carbon
#1d1d1f— Ana metin, başlık çerçeveleri, gezinme çizgileri, kart çerçeveleri - baskın mürekkep rengi, hafif bir sıcaklık tonuyla neredeyse siyahtır. - Frost
#f5f5f7— Sayfa tuvali, ana metin arka planı ve altbilgi yüzeyi, saf beyazdan biraz daha soğuk olan Apple'ın imzası niteliğindeki açık gri renktedir. - Ice
#f4f8fb— Etkileyici yüzey dolguları, incelikli tonlar, koyu bir arka plan üzerinde düğme metni—bölümü öne çıkarmadan canlandıran incelikli bir mavi tonu. - Smoke
#333333— İkincil metin, gezinme dolgusu, düğme kenarlıkları - Orta gri tonlarından daha fazla etki gerektiren kenarlıklar ve simgeler için çok yönlü, nötr bir renk. - Graphite
#474747— Gezinti metni, gezinme kenarlıkları, bağlantı kenarlıkları - öğe hiyerarşisinde Karbon ve Duman arasında ara bir konumda yer alır. - Ash
#707070— Altbilgi metni, liste kenarlıkları, gezinme kenarlıkları, soluk gövde metni - Var olması gereken ancak göze batmayan içerikler için orta gri tonu.
Tipografi
12 ila 56 piksel arası · 8 adım
- SF Pro Display — yenisiyle değiştirme: Inter · ana hatlar 400, 600, 700 · Başlıklar ve büyük metinler—40 piksel ve üzeri boyutlar, daha dar bir açıklık ve daha güçlü negatif izleme için bir ekran formatı kullanır; 700 reklam düzenleri için, 400 ise editoryal içerikteki ürün adları için ayrılmıştır.
- SF Pro Text — yenisiyle değiştirme: Inter · ana hatlar 300, 400, 600 · Gövde metni, gezinme menüsü, düğmeler, alt başlıklar — çalışma yazı tipi; gövde metni için 400, alt başlıklar ve nitelikli etiketler için 300, gezinme öğeleri ve düğme metni için 600; negatif harf aralığı boyuta orantılı olarak azalır (-0.022em'den 12px'e, -0.01em'den 44px'e).
Aralıklar ve biçim
| Amaç | Anlam |
|---|---|
| Yoğunluk | ortalama |
| Temel adım | 12px |
| Düğme yarıçapı | 980px |
| Kart yarıçapı | 8px |
| Gölgeler | hayır - gölgeler yerine kenarlıklar |
| Bölümler arasında | 64px |
| Sayfa genişliği | 1440px |
Yapay zeka, web sitenizi Apple tarzında oluşturacak ve içeriğini dolduracak.
- Ürünlerinizi ve gönderilerinizi aşağıdaki bağlantılar aracılığıyla paylaşın: Instagram, TikTok, Facebook.
- Eski sitenizdeki içeriği aktarın; sadece adresi belirtmeniz yeterli.
- En iyi motor üzerinde modern tasarım: Sunucu tarafı işleme ve SEO optimizasyonu özellikleriyle birlikte React ( Next.js).
- Arama sonuçları için tamamen otomatik SEO optimizasyonu ve sinir ağı tabanlı öneriler.
Benzer stiller
- Ui — mat kağıda klinik plan
- ElevenLabs — Sıcak krem tonlarında, incelikli başlıklarla hazırlanmış bir fotoğraf denemesi. Bauhaus tarzı bir defter: yumurta kabuğu renginde kağıt, siyah mürekkep ve ürün sergilemek için tek bir mor ve turuncu vurgu.
- monopo saigon — Editörlük sessizliğinin ardındaki akışkan, yanardöner bir parıltı—erimiş ışık üzerinde yüzen tek renkli bir editörlük galerisi
- Awesomic — Turuncu noktalama işaretleriyle konfetiyi andıran, editoryal amaçlı çinko ağ.
- Monad — sıcak parşömen üzerine editoryal teknik dergi
- Dub — Link'in mat pirinç kağıdı kontrol paneli
- Seline Analytics — Sıcak kağıt üzerinde sessiz, analitik bir masa.
- Ventriloc — Sıcak kağıt üzerindeki verilerin editoryal gözlem evi - tek bir turuncu kor, tek renkli hassasiyeti vurguluyor.
- Duolingo — Beyaz kağıt üzerinde neşeli sınıf maskotu
- Stripe — Buzlu cam üzerine çivit mavisi mürekkeple yazılmış bir hesap defteri.
- Notion — Öğlen güneşinde ısınmış bir kağıt defter
- Hyer Aviation — Kokpitte, parşömen üzerinde alacakaranlık çökmüş. Soluk şafak gökyüzü, gövde boyutundaki serif yazı tipindeki logoyla buluşuyor ve tek bir sıcak kil rengi vurgu, tekdüze kısıtlamayı kırıyor.