Çerez ayarları

Hangi grubun çalışacağını siz seçin. Açmadığınız hiçbir şey yüklenmez. Çerez politikası

  • Sitenin çalışması için gerekenler: dil tercihiniz ve bu onay kaydı. Kapatılamaz.

    Umami

    Her zaman açık
  • Hangi sayfaların okunduğunu, nereye tıklandığını ölçer. Isı haritası ve oturum kaydı burada.

    Umami

  • Reklamlarımızın işe yarayıp yaramadığını ölçer.

    Şu an bu grupta çalışan bir araç yok.

Paf'a sor

Odaların içinde duruyormuş gibi hissettiren bir mimarlık portfolyosu.

Web sitesi · İzmir

Vela Architects: web sitesinin ana sayfası
PF-21 · Örnek / demo
Durum
Örnek / demo: süreci göstermek için stüdyonun tasarlayıp kodladığı bir çalışma. Ücretli bir müşteri projesi değil.
Örnek marka
Vela Architects
Sektör
Mimarlık
Hizmetler
Strateji, Tasarım, Kodlama, CMS, Hareket
Pafta
PF-21
Süre
3-4 hafta

Ekranda sözü binalara nasıl bırakırsınız?

Bir oda istiyorlardı, ellerinde bir broşür vardı.

/01 İş tanımı

Vela, İzmir'de bir mimarlık ofisi. 2011'den beri kıyıda evler ve kamusal yapılar yapıyor. Eski siteleri bir broşür gibi okunuyordu: derli toplu, uzun metinli. Binalarından birinin içinde durmanın hissine hiç benzemiyordu.

Okurları özel müşteriler, gayrimenkul geliştiricileri ve yarışma jürileri, yani işi mekânı değerlendirmek olan insanlar. İstek, sözü binalara bırakmaktı: kenardan kenara fotoğraflar, kolayca bulunan projeler ve bunun dışında çok az şey.

Vela Architects: ana sayfa, aşağı kaydırılmış
Ana sayfa, baştan sona

Altı sayfa, iki dil ve yapılan her şeyin dizini.

/02 İlk pafta

Pafta hedefi kıyıda daha çok proje almak olarak koydu. Türkçe ve İngilizce altı sayfa sıraladı: Ana sayfa, Dizin, Proje, Stüdyo, Blog ve İletişim. Proje sayfalarına bir de kaydırma hareketi eklendi.

İçerik stüdyonun kendi fotoğraf arşivinden, çizimlerinden ve ortakların yazdığı kısa metinlerden geldi. Tasarıma başlamadan önce arşivi onlarla birlikte ayıkladık. Böylece hangi projelerin tam bir sayfayı taşıyabileceğini biliyorduk.

PF-21 · Onaylandı

Tür
Portfolyo sitesi
Kimin için
Özel müşteriler, gayrimenkul geliştiricileri ve yarışma jürileri
Hedef
Yapılan işleri göstermek ve kıyıda daha çok proje almak
Sayfalar
Ana sayfa, Dizin, Proje, Stüdyo, Blog, İletişim
Özellikler
Filtrelenebilir proje dizini, görsel ağırlıklı proje sayfaları, kaydırma hareketi
İçerik
Stüdyonun fotoğraf arşivi, çizimler, ortakların kısa metinleri
Diller
Türkçe, İngilizce
Süre
3-4 hafta
Tek bir sayfa kodlanmadan önce çizilen pafta

Kireç taşı rengi kâğıt, mürekkep ve tek bir Ege mavisi.

/03 Görünüm

Renkler stüdyonun malzemesi: kireç taşı beyazı, mürekkep ve bağlantılarla etkin filtre için tek bir Ege mavisi. Switzer her şeyi sade ve düzgün diziyor. Instrument Serif yalnızca proje başlıklarında, taşa kazınmış bir isim gibi görünüyor.

Fotoğraflar kenardan kenara uzanıyor. Metin onların yanında, dar sütunlarda duruyor, asla üstlerinde değil. Kayan galeri yok: bir evin içinde, ön kapıdan terasa yürür gibi kaydırarak ilerliyorsunuz.

Yakından bir ayrıntı: yazı ve boşluklar, ziyaretçinin okuduğu boyutta.
Vela Architects: ana sayfadan bir ayrıntı

2011'den bu yana her iş, yapı türüne ve yılına göre filtreleniyor.

/04 Sayfalar

Dizin, ofisin yaptığı her projeyi listeliyor ve yapı türüne ve yılına göre filtrelenebiliyor: evler, oteller, kamusal yapılar, iç mekânlar. Bir jüri doğrudan kamusal yapılara gidebiliyor, özel bir müşteri de kıyıdaki bütün evleri görebiliyor.

Proje sayfaları binanın içinde bir yürüyüş temposunda ilerliyor: varış, ana oda, ışık, ayrıntılar, sonra çizimler. Her sayfa bir sonraki projeyle bitiyor. Böylece ziyaretçi menüye dönmek yerine yürümeye devam ediyor.

Vela Architects: proje sayfası
Vela Architects: proje sayfası
Vela Architects: proje dizini sayfası
Vela Architects: proje dizini sayfası

Kenardan kenara fotoğraflar, eldeki ekrana göre kırpılmış.

/05 Telefonda

Gayrimenkul geliştiricileri bağlantıları birbirine iletiyor ve bu bağlantılar telefonlarda açılıyor. Her fotoğrafın uzun ekran için seçilmiş bir kırpımı var. Böylece bir cephe hiçbir zaman ince bir şeride küçülmüyor, çizimler de tam ekran açılabiliyor.

Dizin tek bir listeye dönüşüyor, filtreler ekranın altından açılan bir pencerede duruyor. Kaydırma hareketi kalıyor ama daha yumuşak. Cihazından daha az hareket isteyen ziyaretçiler için de kapanıyor.

Vela Architects: üç telefonda web sitesi
Telefonda

Her çekimden sonra ortakların kendi güncelleyebileceği bir portfolyo.

/06 Çizilenler

Vela Türkçe ve İngilizce kuruldu. Sitede tam proje dizini, stüdyo arşivinden kurulan proje sayfaları, bir blog ve ortakları, birlikte nasıl çalıştıklarını anlatan bir stüdyo sayfası var.

Siteyi ortaklar kendileri güncelleyebiliyor: bir çekimden sonra görselleri ekler, kısa bir metin yazar ve projeyi iki dilde yayınlarlar.

  • Türkçe ve İngilizce altı sayfa
  • Yapı türüne ve yılına göre filtrelenen proje dizini
  • Stüdyo arşivinden görsel ağırlıklı proje sayfaları
  • Azaltılmış hareket ayarına uyan kaydırma hareketi
  • Blog ve stüdyo sayfası
  • Her çekimden sonra ortakların kullanacağı panel

Görsel ağırlıklı ama ziyaretçiyi görseller için bekletmeyen bir site.

/07 Performans ve erişilebilirlik

Bu sitenin asıl meselesi büyük fotoğraflar. Bu yüzden onların dosya boyutunu tasarımın bir parçası olarak ele aldık. Her görsel ekranın ihtiyaç duyduğu boyutta sunuluyor ve siz hâlâ birine bakarken bir sonraki yükleniyor.

Fotoğrafla anlatan bir sitede her görselin yazılı bir açıklaması olmalı. Dizin filtreleri de klavyeyle çalışmalı.

Paftane çizdi ve kodladı: Strateji, Tasarım, Kodlama, CMS, Hareket.

Hizmet: Web sitesi →
Sonraki pafta · PF-12 · E-ticaret sitesiKuzey Roasters