İstemi Kullanın
Proje Gereksiniminizi Ekleyin
Bağlamınızı aşağıya ekleyin. İstemi kopyaladığınızda veya indirdiğinizde bu bilgiler de eklenecektir.
[PROJECT] ve [AUDIENCE] için mevcut proje teknoloji yığınını kullanarak duyarlı bir HTML web sitesi oluşturun. Görev: Yaratıcı Stüdyo Portföyü.
Gerekli içerik ve yapı
Uzmanlık alanı, rol, yıl ve vaka çalışması bağlantılarıyla üç proje sunun; etkileyici tipografi ve asimetrik bir görsel ızgara kullanın.
Adlar, tarihler, rakamlar, iddialar ve hedefler için kaynak olarak [APPROVED_CONTENT] kullanın. Herhangi bir şeyi ikame etmeden önce eksik girdileri listeleyin. Gösterim gerekiyorsa içeriğini kurgusal olarak etiketleyin. Müşteri alıntıları, sıralamalar, iş ortağı logoları veya ürün yetenekleri uydurmayın.
Tasarım yönü
[BRAND_RULES] ile projede önceden seçilmiş tasarım sistemini kullanın. Herhangi bir sistem sağlanmamışsa şu yönden başlayın: sıcak fildişi, kömür rengi tipografi ve ölçülü kullanılan tek bir asit yeşili vurgu; geniş boşluklar ve asimetrik bir ızgara. Tipografi, aralık ve renk rollerini tutarlı tutun. Göreve dekoratif unsurlardan daha fazla öncelik verin ve birbiriyle ilgisiz kartlardan oluşan sıradan bir koleksiyondan kaçının.
Proje içeriği
Üç projenin her biri için başlığını, tek cümlelik proje özetini, uzmanlık alanını, yılını, stüdyo rolünü, birlikte çalışanların katkı bilgilerini, ana görselini ve vaka çalışması hedefini ekleyin. En güçlü projeyle başlayın; diğer ikisini çeşitliliği göstermek için kullanın. Sağlanan iletişim yoluyla bitirin. Eksik hedefler için vaka çalışması anlatıları uydurmayın.
Düzen ve davranış
Görsel ölçeği ve yerleşimiyle asimetri oluşturun; açıklamaların hizalamasını tutarlı tutun. Proje adlarını ve katkı bilgilerini görsellerin dışında tutun. Kırpma onaylanmadıkça sağlanan görsellerin oranlarını koruyun. Mobilde sırasıyla giriş, öne çıkan proje, destekleyici projeler ve iletişim bölümlerini alt alta yerleştirin.
Göreve özel kabul kontrolü
- Uzun bir başlığı, portre biçiminde bir görseli ve birden fazla katkıda bulunan kişiyi kontrol edin.
- Her proje hedefine klavyeyle erişilebilmesini ve tüm katkı bilgilerinin üzerine gelmeye gerek kalmadan görünür olmasını sağlayın.
Uygulama ve inceleme
Metni düzenlenebilir tutun. Anlamsal yapı, açıklayıcı kontroller, görünür klavye odağı ve uygun boş/hata durumları kullanın. Dar ve geniş düzenleri kontrol edin. Azaltılmış hareket tercihlerini dikkate alın. Mevcut proje çerçevesini ve bağımlılıklarını koruyun; teknoloji yığınını haber vermeden değiştirmeyin. Düzenlenebilir dosyaları teslim edin ve tamamlanmamış davranışları veya desteklenmeyen girdileri açıklayın. Ek özellikler önermeden önce bu görevi özel olarak inceleyin.
Referans eki ve yeniden oluşturma hedefi
Bu istemin indirme paketindeki reference.webp dosyasını, bu istemle birlikte OpenDesign'a ekleyin. Benzer kompozisyon ve hiyerarşiye sahip, düzenlenebilir bir sonuç oluşturun; referans görselin tamamını bitmiş arayüz olarak gömmeyin. Kurgusal örnek etiketlerle çelişmesi durumunda onaylanmış proje içeriğini ve marka kurallarını koruyun. Görsel eksikse veya okunamıyorsa görsel doğruluk iddiasında bulunmak yerine dosyayı isteyin.
Referans kompozisyonu ve içeriği
Creative Studio Portfolio için görsel referans olarak ekli reference.webp dosyasını kullanın. Oluşturmaya başlamadan önce yukarıdan aşağıya ana bölgeleri; bunların göreli genişlik ve yüksekliklerini, hizalamasını, aralıklarını, tipografi hiyerarşisini, yüzey renklerini, kenarlıklarını, görsellerini ve tekrarlanan bileşenlerini belirleyin. Genel bir şablon kullanmak yerine bu ilişkileri koruyun. Gerekli görev içeriği: Disiplin, rol, yıl ve vaka çalışması bağlantılarıyla üç proje sunun; etkileyici tipografi ve asimetrik bir görsel ızgarası kullanın. Görseli düzenlenebilir öğelere dönüştürürken şu göreve özel yerleşim yönlendirmesini kullanın: Bir projeyi öne çıkarın, diğer ikisini ise çalışma alanının çeşitliliğini göstermek için kullanın. Asimetri, görsel ölçeği ve yerleşiminden doğmalı; açıklamalar ise tutarlı bir hizalamayı ve yazı boyutunu paylaşmalıdır. Hem açık hem koyu fotoğraflar üzerinde okunabilir kalmaları için proje adını, disiplini ve katkı bilgisini görselin dışında tutun. Dar ekranda bilinçli bir dikey sıralamaya dönün: giriş, öne çıkan proje, destekleyici projeler, ardından iletişim. Kırpma onaylanmadıkça görsellerin özgün oranlarını koruyun.
Örnek proje gereksinimindeki görsel yön
sıcak fildişi tuval, büyük boy kömür rengi İsviçre stili sans-serif tipografi, asit yeşili küçük vurgular, geniş negatif alan, mimari ve heykelsi fotoğraflar içeren asimetrik proje ızgarası ve ölçülü bir kobalt panel. Ana bölüm metni tam olarak 'Good ideas. Carefully made.' Gezinti öğeleri 'Work', 'About', 'Contact'. Proje açıklamaları 'Objects / 2026', 'Spaces / 2026', 'Identity / 2026'. Zarif, profesyonel ve editoryal sanat yönetimi.
Etkileşim özellikleri
Referans statik bir konsepttir: aşağıdaki davranış uygulanması gereken bir koşuldur; görselin hâlihazırda çalıştığının kanıtı değildir. Özelleştirilmiş istemi, portföyü oluşturmak istediğiniz projeye kopyalayın. Önce ana sayfayı isteyin; vaka çalışması sayfaları, uydurulmuş proje anlatıları yerine kendileri için sağlanan içeriği kullanmalıdır. Her proje hedefine klavyeyle erişilebilmesini ve tüm katkı bilgilerinin üzerine gelmeye gerek kalmadan görünür olmasını sağlayın. Görünen her kontrol için tetikleyiciyi, etkilenen durumu ve geri bildirimi belirtin; yerel değişiklikleri ilişkili görünümler genelinde tutarlı durumla uygulayın. Arama ve filtrelerin gerçek sonuçlar vermesini, seçim kontrollerinin açık bir etkin duruma sahip olmasını ve uygun olduğunda kaydetme eylemlerinin görünür beklemede/başarılı/başarısız geri bildirimi sunmasını sağlayın. İlgisiz iş akışları eklemeyin. Gezinti için uygun bağlantılar, eylemler için düğmeler ve simge kontrolleri için erişilebilir adlar kullanın. Yalnızca yerel bir demo değiştiğinde arka uç işleminin başarılı olduğunu ima etmeyin.
Görsel karşılaştırma ve teslim
- Sonucu ekli görselle eşleşen oranlarda karşılaştırın. Dekoratif ayrıntıları iyileştirmeden önce ana bölgelerin yerleşimini, göreli görsel boyutlarını, satır sonlarını, boşlukları, tipografi hiyerarşisini, kontrastı, etkin durumları ve içerik yoğunluğunu inceleyin.
- Ardından masaüstü metnini küçük etiketlere sıkıştırmadan dar düzeni test edin.
- Logoları, fotoğrafları ve simgeleri ayrı varlıklar olarak; anlamlı tüm etiketleri ise düzenlenebilir tutun. Kullanılamayan yazı tiplerini/varlıkları ve bilinçli sapmaları listeleyin. Çalışan dosyalarla birlikte uygulanan davranışların ve kalan entegrasyonların kısa bir açıklamasını sunun; yalnızca isteme dayanarak piksel düzeyinde aynı sonuç vadetmeyin.
İstemi + Görseli İndir
Eksiksiz istemi ve tam boyutlu referans görselini içerir. Düzeni yönlendirmek için ikisini de OpenDesign'a ekleyin.
Yaratıcı Stüdyo Portföyü Tasarım İstemi Nasıl Yazılır?
Disiplin, rol, yıl ve vaka çalışması bağlantılarıyla üç proje sunmak için bu yaratıcı stüdyo portföyü tasarım istemini kullanın; etkileyici tipografi ve asimetrik bir görsel ızgarası tercih edin.
AI tarafından oluşturulan aynı konseptten ayrıntı kırpmaları; bunlar çalışan bir web sitesinin ekran görüntüleri değildir.
Stilden Önce Hiyerarşiyi Tanımlayın
“Good ideas. Carefully made.” girişin sol tarafının büyük bölümünü kaplar. Stüdyo açıklaması sağda çok daha küçük bir blokta yer alır; Work, About ve Contact üstte kalır. Fildişi arka plan ve kömür rengi yazılar bu hiyerarşiyi desteklerken küçük yeşil vurgu bir odak noktası oluşturur.
“Editorial” tek başına kompozisyonu yoruma açık bırakır. Baskın öğeyi, destekleyici metnin nereye yerleşeceğini ve hangi ayrıntıların geri planda kalması gerektiğini belirtin. Gerçek başlığınızı ayrıca tanımlayın: örnekteki sözcükler kurgusaldır ve daha uzun bir başlık farklı satır sonları gerektirir. Bir projeyi öne çıkarın, diğer ikisini ise çalışma alanının çeşitliliğini göstermek için kullanın. Asimetri, görsel ölçeği ve yerleşiminden doğmalı; açıklamalar ise tutarlı bir hizalamayı ve yazı boyutunu paylaşmalıdır. Hem açık hem koyu fotoğraflar üzerinde okunabilir kalmaları için proje adını, disiplini ve katkı bilgisini görselin dışında tutun. Dar ekranda bilinçli bir dikey sıralamaya dönün: giriş, öne çıkan proje, destekleyici projeler, ardından iletişim. Kırpma onaylanmadıkça görsellerin özgün oranlarını koruyun.
İstemden
sıcak fildişi tuval, büyük boy kömür rengi İsviçre stili sans-serif tipografi, asit yeşili küçük vurgular, geniş negatif alan
Kendinize Uyarlayın
[STUDIO_NAME] ve [APPROVED_HEADLINE] kullanın. Başlığı soldaki baskın öğe yapın; sağa kısa bir stüdyo tanıtımı yerleştirin. Work, About ve Contact öğelerini bunların üzerinde kompakt tutun. [BRAND_RULES] içinden ölçülü tek bir vurgu rengiyle sıcak fildişi ve kömür rengini kullanın. Başlığı sığdırmak için küçültmek yerine doğal biçimde satırlara bölünmesine izin verin.
Çalışma Izgarasını Bir İçerik Sözleşmesine Dönüştürün
Üç görsel, konuları ve renkleriyle kontrast oluşturur: açık renkli heykelsi bir nesne, güneş alan bir iç mekân ve kobalt renkli bir kimlik paneli. Açıklamaları görsellerin altında ortak bir taban çizgisinde hizalanır. Görünen satır yaklaşık olarak üç eşit sütundan oluşur; istem asimetrik bir hiyerarşi talep etse de belirgin biçimde büyütülmüş bir öne çıkan proje göstermez.
Bu cümle, ikna edici görünen bir galerinin bunları içermesini ummak yerine sonucun neleri kapsaması gerektiğini tanımlar. Küçük konsept görseli, gerekli her rolü veya katkıda bulunan bilgisini açıkça göstermez. Bu alanları uygulamada koruyun ve gerçek proje kayıtlarınızla kontrol edin. Referans ile yazılı proje özeti arasındaki farkı da giderin: görsel eşleşmeyi artırmak için üç eşit sütunlu bir satır seçin veya bir projeyi bilinçli olarak büyütün.
İstemden
Üç projenin her biri için başlık, tek cümlelik proje özeti, disiplin, yıl, stüdyonun rolü, katkıda bulunanların bilgileri, ana görsel ve vaka çalışması hedefini ekleyin.
Kendinize Uyarlayın
Tam olarak şu üç onaylanmış proje kaydını kullanın: [PROJECT_RECORDS]. Masaüstü genişliğinde, referansla eşleşmesi için ana görselleri üç eşit sütunda sunun. Başlık, disiplin, yıl, stüdyonun rolü ve katkıda bulunanların bilgilerini her görselin altında düzenlenebilir metin olarak tutun. Her projeye sağlanan vaka çalışması URL'sini atayın. Her görselin oranlarını koruyun; eksik katkı bilgileri veya hedefler uydurmayın.
Görselin Gösteremediği Davranışı Yazın
“View case study” etiketi gezintiyi çağrıştırır; ancak statik bir görsel bağlantının nereye gittiğini, klavye odağının görünür olup olmadığını veya telefonda ne yaşandığını gösteremez. Bunlar yazılı gereksinimler olarak belirtilmelidir. Genel amaçlı bir istem bunlardan söz ediyor diye arama, filtre veya kaydetme kontrolleri eklemekten kaçının; bunlar bu portföyün görünür görevinin parçası değildir.
Tetikleyiciyi ve sonucu açıklayın: Proje başlığına veya vaka çalışması bağlantısına tıklamak aynı onaylanmış hedefi açar. Ardından dar ekran okuma sırasını tanımlayın. Modelden bu masaüstü görseline bakarak mobil yerleşimi çıkarsamasını veya temel proje bilgilerini üzerine gelme etkileşiminin arkasına gizlemesini istemeyin. Sayfayı potansiyel bir müşteri gibi değerlendirin: Stüdyonun uzmanlık alanını belirleyebiliyor, işi kimin yaptığını anlayabiliyor ve üzerine gelmeden bir vaka çalışmasını açabiliyor musunuz? Uzun bir proje başlığını, portre biçiminde bir görseli ve birden fazla katkıda bulunanı olan bir projeyi test edin. Ardından klavyeyle ve dar bir ekranda gezinin. İlk sonuç genel bir ajans sayfası gibi görünüyorsa efekt veya daha fazla bölüm eklemeden önce proje hiyerarşisini ve açıklamaları gözden geçirin.
İstemden
Her proje hedefine klavyeyle erişilebilmesini sağlayın ve tüm katkı bilgilerini fareyle üzerine gelmeye gerek kalmadan görünür tutun.
Kendinize Uyarlayın
Her proje başlığının ve “View case study” bağlantısının aynı onaylanmış URL'ye yönelmesini sağlayın. Görünür bir klavye odağı durumu sunun ve katkı bilgilerini her zaman görünür tutun. Dar ekranlarda giriş, üç proje ve iletişim bölümlerini bu sırayla alt alta yerleştirin. Uzun adların satırlara bölünmesine izin verin. Bir vaka çalışması URL'si eksikse proje bilgilerini çalışmayan bir bağlantı olmadan gösterin ve eksik girdiyi bildirin.
Proje Özetini Oluşturun, Ardından Her Seferinde Tek Bir Kararı Gözden Geçirin
Görev ve hedef kitleyle başlayın, gerçek proje kayıtlarını ekleyin, görsel hiyerarşiyi açıklayın, ardından gezinme ve mobil davranışı belirtin. Referans görseli metinle birlikte ekleyin. Yukarıdaki üç “Kendinize Göre Uyarlayın” bölümü, tam istemin ilgili bölümlerinin yerine geçer; körü körüne sona eklenecek ek talimatlar değildir. Özellikle eşit sütunlu yorumu seçerseniz asimetrik ızgara talimatını değiştirin.
- İlk sonucu referansla karşılaştırın: başlık vurgusu, görsel sırası, altyazı hizalaması ve arka plan rengi bilinçli seçimler olmalıdır.
- Örnek içeriği en uzun gerçek proje başlığınız ve eksiksiz katkı bilgileriyle değiştirin. Dar bir ekranda hiçbir şeyin kaybolmadığını veya üst üste binmediğini kontrol edin.
- Her proje hedefini açın ve klavyeyle gezinin. Benzer görünen bir ekran görüntüsü, bu etkileşimlerin çalıştığını kanıtlamaz.
Takip İstemi
Bunu ilk sonuçtan sonra kullanın. Düzeltmeyi bu görevin en önemli bölümüne odaklar.
Yalnızca portföy çalışma ızgarasını iyileştirin. Ana projeye net bir ilk konum verin, ardından iki destekleyici projeyi gösterin. Her projenin başlığını, uzmanlık alanını, yılını ve katkıda bulunan kişi bilgilerini fareyle üzerine gelmeye gerek kalmadan görünür tutun. Görsel oranlarını koruyun ve her vaka çalışması bağlantısını klavyeyle erişilebilir kılın. Mobilde aynı okuma sırasını tek sütunda kullanın. Onaylanmış üstbilgiyi, tipografiyi ve iletişim bölümünü değiştirmeyin.
