Web sitesi
Kariyer Web Sitesi Tasarımı
Sekiz ay sahnesi üzerine kurulu bir Kimi kariyer çalışması; kaydırmayla bağlantılı geçişler ve illüstrasyonlu başvuru süreci.
Topluluğa katıl
Tasarım Fikirleri
- Kariyer Açılış SayfalarıBaşvuru sürecini açıklamadan önce işvereni tanıtın.
- İşe Alım Kampanyası Web SiteleriGörsel bir temayı katılım ve başvuru bilgileriyle ilişkilendirin.
- Kaydırmalı Marka HikayeleriUzun bir anlatıyı belirgin görsel sahnelere bölün.
Kariyer Sayfası Öne Çıkanlar
- Sekiz Kaydırmalı SahneKokpit tanıtımından başvuru sekansına uzanan bir akış.
- Tek Bir Ay Görsel TemasıAylar, yörünge yolları ve piksel grafikler sahneleri birbirine bağlıyor.
- Numaralı Bir Başvuru DiyagramıDört numaralı durak, süreci görsel bir güzergaha dönüştürüyor.
Kariyer Web Sitesi Tasarımı Önizlemesi
1 / 8
Sekiz Sahneyle Anlatılan Bir Kariyer Sayfası
Bu Kimi kariyer yeniden yapılandırması, bölümlerin yalnızca görüntü alanından geçtiği uzun bir sayfa değildir. Sekiz sahneyi tek bir görsel sahnede üst üste koyar ve bunların opaklığını, konumunu, ölçeğini ve bulanıklığını değiştirmek için kaydırma ilerlemesini kullanır. Etki, sıradan bir iş listesi sayfası okumaktan çok bir sunumun kareleri arasında geçişe benzer.
Bu ayrım, hem görsel çekiciliğini hem de kariyer web sitesi tasarımı olarak sınırlılıklarını açıklar. Sekans güçlü bir atmosfer kurabilir; ancak pratik bilgilerin geçişlerin dışında da erişilebilir kalması gerekir. Başvuru sürecini arayan bir ziyaretçinin görevi, marka hikayesini keşfeden birinin görevinden farklıdır.
| Sekans Bölümü | Görünen İçerik | Korunması Gereken Bilgi |
|---|---|---|
| Giriş ve Ay Sahneleri | Kuruluşun kimliği ve bir ay keşfi ortamı. | Sayfanın kaydırma yapılmadan önce bile işe alım sayfası olarak tanımlanabilmesini sağlayın. |
| Katılım ve İnşa | Katılım ve Kendi İşini Yarat davetleri. | Mevcut sonraki adımı yalnızca görsel bir metaforla değil, kelimelerle de açıklayın. |
| Başvuru ve Kapanış | Dört duraklı bir süreç diyagramı ve son bir davet. | Hikaye sona erdiğinde başvuru rehberliğini ve gerçek bir hedefi erişilebilir tutun. |
Kaydırma Konumu Nasıl Sahne Geçişine Dönüşür
Kaynak, sayfanın kaydırılabilir mesafesini sekiz sahneden her birine karşılık gelen 0'dan 7'ye kadar olan konumlarla eşleştirir. Bir sahne, bu konuma en yakın olduğunda geçerli sahne hâline gelir. Komşu sahneler geçiş sırasında kısmen görünür kalabilir; bu nedenle duraklar arasında alınan bir ekran görüntüsü yumuşak veya çift görüntülü görünebilir.
| Kaydırma Konumu | Kaynağın Yaptığı | Okuyucunun Gördüğü |
|---|---|---|
| Tam Bir Sahnede | Opaklığı 1'e ulaşır, mesafeye dayalı bulanıklık 0'a iner. | Okuma veya yakalamaya uygun, yerleşmiş bir kare. |
| Sonraki Sahnenin Yarısında | Her iki komşu sahne de 0,5 opaklığa ve yaklaşık 1,3 piksel bulanıklığa sahiptir. | Her iki bölümün de net bir ekran görüntüsü değil, karışık bir geçiş. |
| Sahnenin Ötesinde | Opaklığı 0'a düşer; daha yakın bir sahne geçerli hâle gelir. | Önceki kompozisyon, normal bir belgenin aşağısına devam etmek yerine geri çekilir. |
Yörüngesel Bir Başvuru Yolunda Dört Numaralı Durak
Başvuru sahnesi bir diziyi ay güzergahına dönüştürür. Bilgisayar simgesi ve Gönder etiketi ile işaretlenmiş 1. Durak alt orta kısımda yer alır; 2. Durak solundadır, 3. ve 4. Duraklar yörüngenin üst bölümünde devam eder. Geometri tanıdık bir soldan sağa zaman çizelgesi olmadığından okuma sırasını sayılar taşır.

Yol Bağlar, Sayılar Sıralar
Yörüngesel bir çizgi, dört durağın birbirine ait olduğunu gösterir. Ancak bu çizgi başlangıç noktasını veya hangi yönde ilerleneceğini tek başına söylemez. Büyük boyutlu numara rozetleri eksik olan sırayı sağlar. Aynı ayrım, kıvrımlı bir işe alıştırma akışında veya illüstrasyonlu bir süreç diyagramında da geçerlidir.
İllüstrasyon Tam Talimat Değildir
Sahne bir başvuru sürecini adlandırır; ancak sağlanan yeniden yapılandırma bunu bir görüntü olarak işler. Çalışan bir sayfa yine de gerçek adım adlarını, gereksinimleri ve hedefleri metin olarak içermelidir. Bu ayrıntılar, diyagram telefonda dikey olarak istiflediğinde okunabilir kalmalıdır.
Görsel Yeniden Yapılandırmanın Gerçek HTML'e İhtiyaç Duyduğu Yerler
OpenDesign bunu komisyonla hazırlanmış bir Moonshot projesi olarak değil, resmi bir hackathon örneği ve görsel çalışma olarak hazırladı. Bu ayrım uygulamada görünürdür: 2–8. sahneler sağlanan referans görüntülerdir ve bu görüntüler aria-hidden olarak işaretlenmiştir. Geçerli sahneyi değiştirmek, görüntünün içindeki etiketleri metin olarak erişilebilir kılmaz.
Başlıkları Arka Plan Görüntüsünün Dışında Tutun
Çalışan bir sürümde sahnenin başlığı ve açıklaması seçilebilir metin olarak kalmalıdır. Arka plan kokpit, yıldızlar veya ayı taşıyabilir; ancak bir başvuru talimatının tek konumu olmamalıdır.
Hareketi Bilgiye Erişimden Ayırın
Hareket azaltıldığında yerleşmiş ve okunabilir bir düzen ile sürece doğrudan bir yol sağlayın. Bu, önerilen bir iyileştirmedir; sağlanan yeniden yapılandırmada doğrulanmış bir özellik değildir. Bir ziyaretçinin sonraki adımı bulmak için kaydırma animasyonunda ustalaşması gerekmemelidir.
Bu Kariyer Web Sitesi Tasarımının Ortaya Koyduğu
Bu vaka çalışması, mevcut açık pozisyonları veya çalışan bir başvuru arka ucunu değil, sahne kompozisyonunu ve kaydırmayla bağlantılı hareketi göstermektedir. Kasıtlı olarak pikselleştirilmiş referans çizimi vektör çizim değildir; yerel çözünürlükte dışa aktarma bu stilistik sınırı ortadan kaldırmaz. Bunu anlatı ve geçiş mekaniğini incelemek için kullanın; gerçek işe alım bilgileri için işverenin resmi kanallarına başvurun.
OpenDesign'da Kariyer Web Sitesi Tasarımı Nasıl Oluşturulur
Hikayeyi ve Pratik Bilgileri Tanımlayın
Kendi kuruluşunuzun tanıtımıyla, katılım seçenekleriyle ve başvuru adımlarıyla başlayın. Görsel tema istemeden önce hangi bilgilerin onaylandığını, hangilerinin yer tutucu olduğunu belirtin.
Önerilen PromptKurgusal bir araştırma stüdyosu için kariyer web sitesi tasarımı oluştur. Giriş, katılım seçenekleri, ekip hikayesi, başvuru süreci ve kapanış daveti genelinde ay keşfi teması kullan. İşe alım gezinmesini lafzî ve okunabilir tut. Başlıkları ve numaralı süreci tek bir görüntü yerine anlamsal metin olarak oluştur. Etiketli yer tutucu roller ve devre dışı bırakılmış yer tutucu başvuru eylemleri kullan; canlı bir işe alım arka ucunu ima etme. Okunabilir, hareketi azaltılmış bir düzen ekle.
Önce Tek Bir Sahne Geçişini İnceleyin
OpenDesign'dan giriş ile sonraki sahneyi, okunabilir bir statik durum koruyarak birleştirmesini isteyin. Geçişin işe alım amacını gizlemediğini veya etkiyi sayfanın geneline yaymadan önce katılım bilgilerine erişimi geciktirmediğini kontrol edin.
Süreci Görsel Metafor Olmadan Test Edin
Başvuru adımlarını düz metin olarak okuyun ve mobilde sıralarını kontrol edin. Gerçek bağlantıların gerçek hedeflere sahip olduğunu ve yer tutucuların açıkça belirlendiğini doğrulayın. Yalnızca bundan sonra yörünge yolunu veya diğer dekoratif işlemi bilginin çevresine ekleyin.
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.



