Web sitesi
Yapay Zekâ Altyapısı Web Sitesi Tasarımı
Örnek çalışma zamanı metrikleri, iç içe özellik kartları, incelikli hareket ve tek bir satış daveti içeren yumuşak bir AI altyapısı açılış konsepti.
Şunlar İçin Tasarlandı
- Altyapı Ürün SayfalarıKarmaşık çalışma zamanı altyapısını teknik alıcıları bunaltmadan açıklayın.
- AI Platform LansmanlarıAgent yeteneklerini somut operasyonel bir dil ve yapı aracılığıyla sunun.
- Geliştirici Odaklı PazarlamaÜrün iddialarını kod, araçlar ve uygulama ayrıntılarıyla ilişkilendirin.
- Güven Odaklı Dönüşüm SayfalarıZiyaretçileri kanıttan ölçülü bir satış görüşmesine yönlendirin.
Öne Çıkanlar
- Operasyonel HeroSakin bir başlığı çalışma zamanı, harcama, görev ve denetim sinyalleriyle eşleştirir.
- Temel Unsurlar Üzerinden AnlatıAltyapı değerini kimlik, harcama, denetim, sandbox, yönlendirme ve ergonomi etrafında düzenler.
- Okunabilir Teknik AyrıntıSoyut yetenekleri temellendirmek için kod, etiketler, birimler ve kısa iddialar kullanır.
- Odaklanmış Kapanış PaneliKoyu ve yüksek kontrastlı bir alanda tek bir doğrudan davetle sona erer.
Galeri
1 / 3
Sakin Bir Agent Çalışma Zamanı Açılış Sayfası
Bu resmî birlikte sunulan örnek, Halcyon'u uzun süre çalışan AI agent'ları için bir çalışma zamanı olarak sunar. Yazılmış “Calmer infrastructure for the agents already running your business” başlığı, altyapıyı başka bir model arayüzü yerine istikrar sağlayan bir katman olarak çerçeveler. Sayfa daha sonra bu konumu görünür çalışma zamanı, harcama, görev ve denetim örnekleriyle destekler.
Örnek Verilerle Altyapı Anlatıları
Sayfa, tek bir pazarlama akışı içinde çeşitli teknik kaygıları açıklaması gereken altyapı ekipleri için uygundur. Dili, daha sakin agent operasyonlarına ilişkin geniş kapsamlı vaatten belirli temel unsurlara, ardından SDK'ler ve CLI'lar üzerinden uygulama erişimine ilerler. Bu sıra, açılışı bir dokümantasyon sayfasına dönüştürmeden teknik okuyuculara devam etmek için bir neden verir.
Görünür rakamlar örnek açılış içeriğinin parçasıdır. Bir tasarımın operasyonel kavramları nasıl somutlaştırabileceğini gösterirler; ancak Halcyon hizmet performansını, uptime'ını, fiyatlandırmasını veya bağlı backend davranışını kanıtlamazlar.
Çalışma Zamanı Güvenilirliği Anlatısı
Hero alanı, çalışan bir agent bağlamını temsil etmek için “RUNTIME · LIVE”, “healthy · 7d 14h uptime” ve bir denetim zaman damgası kullanır. Bu etiketler birlikte hizmet durumunu izlenebilirlikle ilişkilendirir; ödün ise sayfanın yalnızca bir tasarım örneği olduğu durumlarda bile kompakt panelin canlı doğrulama izlenimi verebilmesidir.
Maliyet ve Kontrol Anlatısı
“SPEND / 24H” bölümü “$47.18 USD” gösterirken platform bölümü daha sonra “$0.018 AVG / TASK” sunar. Bu rakamları ayrı bağlamlarda tutmak, sayfanın hem mevcut etkinliği hem de birim ekonomisini ele almasını sağlar; ancak okuyucular bunları tek bir ölçülmüş veri kümesi olarak değerlendirmemelidir.
Geliştirici Benimseme Yolu
Son temel unsur “Three SDKs. Two CLIs.” ifadesini kullanır ve Python, TypeScript, Go, halcyon ile hl adlarını verir. Bu, uyumluluğu kısa bir benimseme sinyaline dönüştürür; ödün ise bilinçli bir sıkıştırmadır, çünkü tasarım API'leri, kurulumu veya desteklenen iş akışlarını açıklamaz.
Çalışma Zamanı Maketinden Satış Davetine
Ortalanmış yüzen hap navigasyonu Halcyon, Platform, Metrics, Docs, Changelog ve Get started seçeneklerini tanıtır. Hero alanı, büyük bir başlık ile yuvarlatılmış çalışma zamanı maketi arasında 1.05fr/0.95fr oranında bölünür. Biraz daha geniş metin sütunu önermeyi taşırken, iç içe kart kabuğu örnek metriklere farklı bir görsel konteyner kazandırır. Bu, önerilen ürünü zihinde canlandırmayı kolaylaştırır; ancak kart operasyonel kanıt değildir.
Başlık, büyük satırlara bölünerek “Calmer infrastructure” ifadesinden “for the agents already running your business” ifadesine ilerler. İkinci ifadede kullanılan gri görünüm, ürün kategorisi ile hedef kitlesi arasında görsel bir geçiş oluşturur. Bu vurgu vaadi akılda kalıcı kılar; ancak ölçek, daha dar ekranlarda dikkatli duyarlı tasarım yönetimi gerektirir.

Çalışma Zamanı Maketiyle Önden Başlayın
Ürün ifadesiyle başlayın, ardından çalışma zamanı panelini yanına yerleştirin. Paneldeki “research-agent / tier-3” etiketi, durum satırı, harcama kartı, görevler kartı ve denetim kaydı, altyapının neyi düzenlemek üzere tasarlandığını gösterir.
Altı Temel Unsura Genişletin
Platform ızgarası altı numaralı kart sunar: kimlik, harcama, denetim, sandbox, yönlendirme ve ergonomi. Kimlik, kod örneği içeren uzun bir hücreyi kaplarken harcama ve denetim yanında yer alır; son üçü daha kısa hücreler kullanır. Kaynak tanıtımında, altı unsur oluşturulmasına rağmen “Five primitives” ifadesi yer alır. Gözlemlenen yapı olarak altı kartlı düzeni koruyun ve bu uyumsuzluğu doğrulanmış bir ürün taksonomisi değil, örnek metin olarak değerlendirin.
Tek Bir Eylemle Kapatın
Kapanış paneli koyu bir arka plana geçer ve “Less duct tape between the model and the bill.” ifadesini ortalar. Kısa bir değerlendirme ve fiyatlandırma ifadesi “Talk to an engineer” seçeneğine yönelerek sayfaya birbiriyle yarışan bitiş seçenekleri yerine tek bir son eylem verir.
Kapsam ve Yetenek Sınırları
Halcyon yalnızca tasarım amaçlı bir açılış konseptidir. Düğmelerinin işletme işleyicileri yoktur; yalnızca Platform bağlantısı eşleşen bir bölüme ulaşır. Metrics, Docs ve Changelog hedefleri bulunmaz, alt bilgi bağlantıları ise yer tutucudur. Örnek uptime, harcama, görev sayıları, gecikme, finansman ve güvenlik etiketleri hizmet kanıtı değildir. Hareketli şirket şeridindeki adlar müşteri veya destek beyanı oluşturmaz; SOC 2/ISO 27001 metni de sertifikasyonu doğrulamaz. Konsol erişimi, faturalandırma, yönlendirme, depolama ve satış iletişimi ayrı bir uygulama gerektirir.
Yumuşak görünüm, çalışan bir altyapı sisteminden değil; gümüş bir tuval, Plus Jakarta Sans, adaçayı tonunda vurgular ve iç içe yuvarlatılmış kabuklardan gelir. CSS, kayan bir arka plan mesh'i, titreşen bir durum noktası ve üzerine gelindiğinde duran, sürekli hareket eden bir şirket adı şeridi ekler. IntersectionObserver, bölümler görünüme girdikçe onları görünür hâle getirir. Reduced-motion kuralları mesh kaymasını ve bölüm görünme animasyonlarını devre dışı bırakır, ancak titreşimi veya kayan yazıyı devre dışı bırakmaz; tasarımı uyarlarken kalan bu animasyonları hesaba katın.
Kaynak ve Atıf
OpenDesign, Community dağıtıcısıdır. Kaynak dokümantasyonu, yumuşak görsel ve hareket rehberliğini Taste Skill by Leonxlnx'e atfeder: https://github.com/Leonxlnx/taste-skill. Bu upstream rolünü, numunenin kişisel yazarlığını veya OpenDesign'in temel yönün bağımsız yazarı olduğunu ima etmeden koruyun. Manifest dosyası, birlikte sunulan eklenti için MIT lisansını beyan eder; tasvir edilen her varlık için ayrı haklar oluşturmaz.
OpenDesign'da Yapay Zekâ Altyapısı Web Sitesi Tasarımı Nasıl Oluşturulur
Kanıt Hiyerarşisini Belirleyin
Büyük bir sol başlık ve sağda bir çalışma zamanı paneliyle Halcyon tarzı bir hero alanı oluşturun. “research-agent / tier-3”, “SPEND / 24H”, “TASKS / 24H” ve “AUDIT · LAST ENTRY” somut görünür alanlarını eklerken, tüm değiştirme amaçlı rakamları temsili veya doğrulanmış veri olarak işaretleyin.
Önerilen PromptHalcyon adlı kurgusal bir çalışma zamanı için tek parça bir AI altyapısı açılış konsepti oluşturun. Gümüş #F2F2F0, koyu mürekkep rengi, adaçayı tonunda vurgular, Plus Jakarta Sans ve sabit genişlikli yazı tipinde meta verileri kullanın. Yüzen bir hap navigasyonu ve 1.05fr/0.95fr oranında bir hero düzeni ekleyin: solda 14ch genişliğinde büyük bir başlık, sağda ise iç içe yuvarlatılmış bir çalışma zamanı maketi bulunsun. research-agent/tier-3, uptime, 24 saatlik harcama, 24 saatteki görevler ve bir denetim kaydı için açıkça etiketlenmiş örnek değerler gösterin. Kimlik, harcama, denetim, sandbox, yönlendirme ve ergonomi için altı özellik kartı oluşturun: uzun bir kimlik kodu örneği, ayrı bir maliyet kartı ve koyu bir denetim kartı, ardından üç kısa kart kullanın. İç içe eş merkezli yuvarlatılmış kabuklar kullanın ve hap düğmelerinin sonuna ok içeren daireler yerleştirin. Ölçülü CSS mesh kayması, durum titreşimi ve üzerine gelindiğinde duran şirket adı kayan yazısı ekleyin; bu önerilen uyarlamadaki tüm animasyonlar için reduced-motion davranışını sağlayın. Tek bir koyu, yuvarlatılmış satış daveti paneliyle bitirin. 980px altında hero ve özellik kartlarını alt alta yerleştirin. Gerçek bir yerel bağlantıya yalnızca Platform ihtiyaç duysun; diğer navigasyon ve işletme düğmelerini yer tutucu olarak işaretleyin. Gerçek müşteriler, finansman, sertifikalar, faturalandırma, agent çalıştırma, konsol erişimi veya bir backend iddia etmeyin. Tasarım rehberliği kaynağı olarak Taste Skill by Leonxlnx'i ve Community dağıtıcısı olarak OpenDesign'i koruyun. Bu, özgün prompt değil, önerilen bir yeniden oluşturmadır.
Temel Izgarayı İyileştirin
Platform anlatısını kimlik, harcama, denetim, sandbox, yönlendirme ve ergonomi etrafında düzenleyin. Uzun ömürlü kimlik kodu örneği, ayrı ortalama görev maliyeti değeri ve koyu denetim kartı arasındaki kaynak ilişkisini koruyun. Görsel ağırlığın anlatıdaki öneme göre ilerlemesi için son üç temel unsurda daha kısa kartlar kullanın.
Dönüşüm Kapanışını Kontrol Edin
Koyu bir kapanış paneli, ortalanmış tek bir mesaj ve “Talk to an engineer” gibi tek bir eylemle bitirin. Büyük başlığın doğal biçimde satırlandığını, hero panelinin yanında okunabilir kaldığını ve örnek iddiaların her görünüm alanında doğrulanmış ürün davranışından ayırt edilebildiğini kontrol edin.
Dışa Aktarın ve Paylaşım Bağlantısı Alın
Bitmiş tasarımınızı dışa aktarın, ardından bir paylaşım bağlantısı almak için OpenDesign'daki Paylaş seçeneğini kullanın. Bağlantıyı göndermeden önce ayrı bir tarayıcı penceresinde açarak amaçlanan sürümün ve bileşenlerinin erişilebilir olduğunu doğrulayın.



