INO
Sessiz bir müze vitrini – her sergilenen eser, neredeyse siyah, zar zor duyulabilen bir yazı tipiyle çerçevelenmiş, camın arkasında tek bir nesne gibi beyaz bir boşlukta havada asılı duruyor.
INO, neredeyse tek renkli bir mücevher galerisi gibi işlev görüyor: canlı beyaz bir tuval, tek, sıcak, neredeyse siyah bir mürekkep ve neredeyse tamamen renksiz bir ortam. Görsel sistem, her yüzüğü bir müze parçası gibi ele alıyor; geniş negatif alanda yüzen, yazı tipi ölçeği veya renginden ziyade konum, harf aralığı ve beyazın hacmiyle oluşturulmuş hiyerarşiye sahip, klinik ürün fotoğrafları. Sayfanın alt kısmında, etiketli (dolu veya boş) dört noktadan oluşan bir gezinme menüsü bulunuyor; bu, geleneksel e-ticaret üst çubuğunun bilinçli bir tersine çevrilmesi. Marka işareti ise, ürünün şeklini yansıtan ve bir logodan ziyade tipografik bir heykel görevi gören, eş merkezli halka konturlarından oluşuyor.
Sayfa genişliğinin tamamını kaplayan, maksimum içerik genişliği sınırı olmayan bir tuval. Ana ekran, sayfanın tüm genişliğini kaplar ve fotoğraf ile grafikler eşit olarak (50/50) dağıtılmıştır. Ürün ızgaraları, görünüm alanının kenarından geniş bir yatay kenar boşluğuyla üç sütunlu satırlar halinde görüntülenir. Alt gezinme çubuğu ortalanmış ve sayfa altbilgisine sabitlenmiştir, sabitlenmemiştir. Bölüm ayırıcılar, tam ekran editoryal fotoğraf veya tamamen beyaz boşluk kullanır; asla renk çubuğu, bölme çizgisi veya gradyan kullanılmaz. Dikey ritim serbesttir: ana bölümler arasında 80/1/1, sayfanın içerikle doldurulmak yerine nefes almasını sağlar. Yan çubuk, mega menü veya üst başlık çubuğu yoktur; "INO" logosu yalnızca ana ekranın sol üst köşesinde yer alır.
İki farklı görüntüleme modu bir arada bulunur: düz, açık gri, dikişsiz bir arka plan üzerinde klinik ürün fotoğrafları (her yüzük, eller, stilize aksesuarlar veya yüzey gölgeleri olmadan, ortalanmış olarak fotoğraflanır; nesne baş kahramandır) ve anlatısal editoryal görüntüler (çim kaplı bir kutuda bir yüzük, zincir tutan bir el), doygunluğu azaltılmış, tam ekran editoryal parçalar olarak sunulur. Ürün görselleri ürün kartları görevi görür; editoryal görüntüler markanın ruh halini yansıtır. Her ikisi de tek renkli veya neredeyse tek renklidir; ana görüntüdeki çim, tek yeşil ipucudur ve o bile orman tonuna indirgenmiştir. Arayüzde simgeler kullanılmaz; tüm ikonografinin yerini eş merkezli bir halka sembolü alır.
Palet
Doğal
- Obsidian Ink
#212123— Renk şemalarının göze batmaması gereken yerlerde, nötr form durumları, simge metni ve gizli kullanıcı arayüzü geri bildirimi. - Bone
#ffffff— Tuval sayfaları, karton yüzeyler, koyu bir arka plan üzerinde ters çevrilmiş metin. Baskın yüzey; neredeyse tüm web sitesi burada yer alıyor. - Carbon
#000000— Gezinti noktası göstergesi için simge dolgusu, dekoratif grafik konturları ve aktif durum dolgusu. "Kemik" rengiyle maksimum ton kontrastı sağlamak için az miktarda kullanılmıştır. - Ash
#999999— Orta kontrastlı kenarlıklar, kontrol konturları ve yapısal ayırıcılar. - Pebble
#a6a6a7— Destekleyici metinlerde sadelik, ana metin için ince ayırıcılar ve ikincil meta veriler kullanılmıştır. Fiyat etiketleri ve arka plana karışması gereken eşlik eden metinler için en açık işlevsel gri tonu kullanılmıştır.
Tipografi
11 ila 18 piksel arası · 4 adım
- Sequel100Wide — yenisiyle değiştirme: Jost (400 · ana hatlar 400 · Tüm bağlamlarda (navigasyon, gövde metni, başlıklar, fiyatlandırma ve alt yazılar) yalnızca 400 kalınlığında kullanılan tek kurumsal yazı tipi. Geniş aralıklı geometrik sembol ve cömert harf aralığı, tüm kurumsal stili yansıtır. Kalın yazı tipi seçeneğinin olmaması kasıtlıdır: hiyerarşi, yazı tipi kalınlığının değiştirilmesiyle değil, büyük harf kullanımı, harf aralığı ve konumlandırma yoluyla sağlanır.
- Arial — yenisiyle değiştirme: system-ui · ana hatlar 400 · Eski bağlamlarda düğmelerin görüntülenmesi için sistem genelinde bir yedek mekanizma. Markalamanın bir parçası değil; yalnızca Sequel100Wide yüklenemediğinde görünür.
Aralıklar ve biçim
| Amaç | Anlam |
|---|---|
| Yoğunluk | yoğun |
| Temel adım | 23px |
| Düğme yarıçapı | 50px |
| Kart yarıçapı | 8px |
| Gölgeler | hayır - gölgeler yerine kenarlıklar |
| Bölümler arasında | 80-120px |
Yapay zeka, web sitenizi INO 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
- Airbnb — Tek bir mercan kırmızısı kitap ayracıyla süslenmiş, sakin beyaz bir galeri duvarı.
- Peak Design — Kısmen aydınlatılmış galeri duvarı
- 099 SUPPLY — Siyah beyaz objelerle dolu bir galeri duvarı.
- Apple (España) — beyaz galeri vitrini
- Apple (España) — Sabah sisinde bir galeri penceresi
- Custo — Metalik gri tonlarında, tek parça bir yazı tipine sahip bir galeri. Soluk gri-yeşil tonlarında bir sergi salonu; burada tek bir koyu obje ve 57 piksel yazı tipi kendi başına konuşuyor.
- Silencio — Havada süzülen objelerle dolu beyaz bir oda. Her bir unsurun negatif hacimli bir arka plana karşı yerini aldığı, sıcak kağıttan yapılmış bir galeri sergisi ve sessizlik, kasıtlı bir tasarım kararı.
- Oakâme — Güneşin bolca vurduğu, sıcak taştan oyulmuş bir Provence atölyesi.
- Nike — Spor başarılarının tek renkli bir galerisi – beyaz duvarlar, sanat eseri gibi sergilenen ürün, arka plana karışmış krom detaylar.
- Sociotype — Beyaz kağıt üzerine basılmış tipik bir müze örneği.
- Arc — gece yarısı suyunun üzerinde endüstriyel beyaz galeri
- Rivian — Galerinin beton duvarında elektrikli bir monolit. Rivian, her aracı geniş beyaz bir alana karşı bir heykel gibi sunuyor; tipografi o kadar büyük ki mimari bir unsur haline geliyor ve tek renkli atmosferi kıran, mat bir yüzey üzerindeki güneş ışığı gibi sıcak bir sarı renk kullanılıyor.