Brand Ingredients
BR-01- Typography01
- Color02
- Tone03
- Imagery04
- Iconography05
- Motion06
AURELIA · Geist · Ink / Paper / Clay / Accent
Web Tasarım
Strateji, içerik, kullanıcı deneyimi ve modern arayüz tasarımını bir araya getirerek markanıza özel web deneyimleri tasarlıyoruz.
Strategy · UX · UI · Design System · Responsive · Motion
KOLEKSIYON / 2026
Mekânın
sessiz lüksü.
Atölyeden mekâna uzanan koleksiyon. Malzeme, oran ve ışık.
2026
Sessiz lüks.
Yaklaşım
Kullanıcı ne yapacağını düşünmek zorunda kalmamalı.
Tasarım markayı diğerlerinden ayırmalı.
Her ekran aynı tasarım dilinin parçası olmalı.
Marka → Arayüz
Brand Ingredients
BR-01AURELIA · Geist · Ink / Paper / Clay / Accent
→ Design tokens →
Digital Interface
UI-01Lounge 01
Koleksiyon
Mekânın sessiz lüksü.
İnceleDENEYİM TÜRLERİ
Markanın, ürünün ve dönüşüm hedefinin ihtiyacına göre farklı dijital deneyim sistemleri tasarlıyoruz.
CORPORATE
Strategy, design and engineering in one coherent brand surface.
Güven, içerik ve marka algısını birlikte kuran kurumsal deneyimler.
Brand System · Content · Corporate UX
ONE MESSAGE. ONE ACTION.
A focused page that turns attention into a single clear next step.
Trusted by product teams · 2.4k launches
Tek hedefe odaklanan, yüksek dönüşüm odaklı lansman sayfaları.
Campaign · Conversion · Launch
Workspace
tevqon / product
PROJECTS
12
ACTIVE
08
Activity
Latest release v2.4Ürünü açık ve ikna edici biçimde anlatan ürün deneyimleri.
SaaS · Product UI · Design System
Vitrin
KOLEKSIYON / 2026
Mekânın
sessiz lüksü.
Atölyeden mekâna uzanan koleksiyon. Malzeme, oran ve ışık.
2026
Sessiz lüks.
Tipografi
Geist Sans
AURELIA Display
Aurelia
Koleksiyon 2026
Malzeme, oran ve ışık. Atölyeden mekâna.
WEB TASARIM · A1
Spec · 04
Başlık, alt başlık ve gövde aynı anda okunur; göz nereye bakacağını bilir.
Satır uzunluğu, satır aralığı ve ölçü, içerik nefes alsın diye ayarlanır.
Metin zeminle ilişkisinde kaybolmaz. Vurgu, bağırarak değil ayrışarak yapılır.
Boşluk bir süs değil; tipografinin temposudur. Sayfa bir ritimle akar.
Grid & Layout
Desktop · 1440
12 col
Hero
Mekânın sessiz lüksü.
Görsel
Tablet · 768
8 col
Hero
Mekânın sessiz lüksü.
Görsel
Mobile · 390
4 col
Hero
Mekânın sessiz lüksü.
Görsel
Consistent alignment
Her blok aynı omurgaya oturur.
Responsive spacing
Boşluk ekranla birlikte ölçeklenir.
Content hierarchy
Öncelik grid’in içinde görünür.
Visual rhythm
Tekrar ve ara, sayfayı taşır.
Scalable sections
Yeni bölümler sistemi bozmaz.
KOLEKSIYON / 2026
Mekânın
sessiz lüksü.
Atölyeden mekâna uzanan koleksiyon. Malzeme, oran ve ışık.
Mekânın sessiz lüksü.
Koleksiyon
Gör2026
Sessiz lüks.
Responsive
Masaüstü tasarımını küçültmek yerine, her breakpoint’te içerik önceliğini ve etkileşimi yeniden düzenliyoruz.
Desktop
Geniş grid, yan yana içerik, tam navigasyon.
Tablet
Orta kolon, sadeleşen menü, dokunma alanları.
Mobile
Tek kolon, öncelikli mesaj, alt CTA.
Navigation adaptation
Menü ekrana göre yeniden kurgulanır.
Content reflow
Bloklar küçülmez; sıra ve ağırlık değişir.
Touch interactions
Hover’a bağlı kararlar dokunmaya çevrilir.
UX Design
User Journey
FLOW · 05
01
Markayı ve teklifi ilk bakışta anlar.
02
İçerik ve yapı güven oluşturur.
03
Seçenekler net, gürültü azdır.
04
Karar anı görünür ve sakin tutulur.
05
CTA yolu kısa, dil tutarlıdır.
Sayfalar ve ilişkiler, kullanıcının zihnindeki modele oturur.
Her adım bir sonrakini hazırlar; çıkmaz sokak bırakılmaz.
Menü, yol tarifi verir; vitrin değildir.
Önce mesaj, sonra kanıt, en sonda eylem.
Düğme, bakışın doğal durakladığı yerde durur.
Tek bir birincil yol; ikincil yollar onu gölgelemez.
Süreç görseli
01
Yapı, hiyerarşi, boşluk.
02
Akış, durum, etkileşim.
Mekânın sessiz lüksü.
Koleksiyon 2026
Koleksiyonu Gör03
Tipografi, renk, karakter.
2026
Mekânın sessiz lüksü.
Design System
Consistency
Aynı karar her ekranda yeniden alınmaz.
Ölçeklenebilirlik
Yeni sayfa, mevcut dile eklenir.
Faster development
Bileşenler hazır olduğu için kod hızlanır.
Easier maintenance
Değişiklik tek kaynaktan yayılır.
Component library · AURELIA
DS / SHEET
Buttons
Inputs
Navigation
Cards
Luna
Atelier
Tags
Tabs
Modals
Koleksiyonu kaydet
Listeye ekle veya paylaş.
KaydetTypography
Aa
56 / 32 / 18 / 14
Spacing
Colors
States
Etkileşim
Navbar transition
navButton hover
btnMenu reveal
menuCard hover
cardLounge 01
Koleksiyon
Image transition
image01
Scroll reveal
scrollSection reveal · 62%
Form feedback
formİçerik
Raw content
merhaba sitemizi yenilemek istiyoruz aslında mobilya satıyoruz ama biraz da atölye hikayesi var müşteriler genelde mimar iletişim formundan yazıyor kampanya da olacak belki...
Structured page
H1
Mekânın sessiz lüksü.
Section
Koleksiyon · Atölye · Hikâye
CTA
Koleksiyonu Gör
Önce ne söylendiği, sonra nasıl kanıtlandığı.
Her bölümün bir işi vardır; dolgu paragrafı yoktur.
Düğme metni eylem söyler, slogan tekrar etmez.
Sayfa, markanın pazardaki yerini netleştirir.
Cümleler kısa, bloklar taranabilir.
Başlıklar, semantik sıra ve içerik omurgası arama için de okunur.
Erişilebilirlik
Erişilebilirliği son sprint süsü olarak değil, tasarım kararının parçası olarak ele alıyoruz. Hedefimiz sertifika iddiası değil; kullanılabilir, okunabilir ve odaklı arayüzler.
Metin ve arayüz öğeleri zeminden ayrışır; vurgu okunabilirlikten ödün vermez.
Ölçü, satır aralığı ve hiyerarşi tarama ve okumayı birlikte taşır.
Dolaşım yalnızca fareye bağlı değildir; sıra ve atlama mantıklıdır.
Odak halkası görünür ve tutarlıdır; “nerede olduğum” kaybolmaz.
Başlıklar ve bölgeler, ekran okuyucunun da anlayacağı bir yapıdadır.
Dil sade, bloklar kısa; anlam görsele hapsolmaz.
Tasarımdan koda
Design
Design System
→Production UI
Production UI
Süreç
01
Keşif
Hedefleri, kitleyi ve mevcut dijital varlığı netleştiririz.
02
Marka & İçerik
Dijital dil, mesaj hiyerarşisi ve içerik omurgasını kurarız.
03
UX Architecture
Sayfa mimarisi, akışlar ve karar anlarını haritalarız.
04
Wireframe
Yapıyı görsel stilden önce doğrularız.
05
Visual Direction
Tipografi, renk ve atmosferi kilitleriz.
06
UI Design
Ekranları yüksek sadakatle tasarlarız.
07
Prototype
Etkileşimleri gerçek kullanıma yakın test ederiz.
08
Development Handoff
Bileşenler, token’lar ve kurallar geliştirme için hazırlanır.
09
QA
Tasarım, responsive ve erişilebilirlik tutarlılığını kontrol ederiz.
01
Keşif
Hedefleri, kitleyi ve mevcut dijital varlığı netleştiririz.
02
Marka & İçerik
Dijital dil, mesaj hiyerarşisi ve içerik omurgasını kurarız.
03
UX Architecture
Sayfa mimarisi, akışlar ve karar anlarını haritalarız.
04
Wireframe
Yapıyı görsel stilden önce doğrularız.
05
Visual Direction
Tipografi, renk ve atmosferi kilitleriz.
06
UI Design
Ekranları yüksek sadakatle tasarlarız.
07
Prototype
Etkileşimleri gerçek kullanıma yakın test ederiz.
08
Development Handoff
Bileşenler, token’lar ve kurallar geliştirme için hazırlanır.
09
QA
Tasarım, responsive ve erişilebilirlik tutarlılığını kontrol ederiz.
Teslimat
Tek bir görsel dosya değil; geliştirilebilir bir tasarım paketi. Mimari, ekranlar, sistem ve handoff birlikte gider.
Teslim paketi
HANDOFF.spec
Seçili işler
Araçlar
Tasarım
Prototype
Development Handoff
Motion
Görsel kararlar, iş hedefi ve içerik omurgasından kopmadan alınır.
Akış ve yüzey aynı elde tasarlanır; biri diğerine sonradan giydirilmez.
Her breakpoint’te öncelik yeniden kurulur; masaüstü küçültülmez.
Ekranlar tek seferlik kompozisyon değil, tekrar kullanılabilir dil.
Token, durum ve kırılım, kodlanabilir gerçeklikle tasarlanır.
Güzel durmak yetmez; mesaj ve CTA yolu çalışır.
Kontrast, odak, klavye ve semantik yapı tasarımın parçasıdır.
Handoff bir dosya atışı değil; aynı ekip geliştirme tarafına taşır.
Keşif, marka ve içerik yönü, UX mimarisi, wireframe, görsel yön, UI tasarımı, prototip, design system ve geliştirme handoff’unu kapsar. Kodlama, web yazılımı hizmetiyle birlikte veya ayrı yürüyebilir.
Hazır tema genel bir kalıptır. Kurumsal tasarım markanıza, içeriğinize ve dönüşüm hedeflerinize göre kurgulanır; her ekran sizin dilinizle konuşur.
Kapsam, sayfa sayısı ve design system derinliğine göre değişir. Keşif sonrası net bir takvim paylaşırız.
Sayfa mimarisi, özel bileşenler, responsive derinlik, prototip ve design system ihtiyacına göre belirlenir. Keşif sonrası şeffaf bir teklif sunarız.
Evet. Figma dosyası, bileşen kütüphanesi ve teslim notlarıyla birlikte teslim edilir.
Evet. Mobil, masaüstünün küçültülmüş hali değildir. Her breakpoint için içerik önceliği ve etkileşim yeniden düzenlenir.
Aynı deneyimin masaüstü, tablet ve telefonda tutarlı ama her ekrana uygun biçimde çalışmasıdır. Navigasyon, içerik ve etkileşim kırılıma göre uyarlanır.
UX, kullanıcının yolu ve karar anlarıdır. UI, o yolun görsel ve etkileşim dilidir. İkisini birlikte tasarlarız.
İçerik yapısını, hiyerarşiyi ve CTA dilini kurgularız. Metin üretimi proje kapsamına göre dahil edilir veya sizin içerik ekibinizle birlikte yürür.
Evet. Mevcut logo, renk, tipografi ve görsel dili dijital arayüze taşırız.
Evet. Dijital için yeterli bir görsel dil — tipografi, renk, ton ve bileşen kuralları — proje içinde kurulabilir.
Evet, yönlendirici ve ölçülü etkileşimler tasarlanır. Aşırı motion kullanılmaz; prefers-reduced-motion dikkate alınır.
Evet, web yazılımı hizmetimizle birlikte kodlanabilir. Yalnızca tasarım da teslim edilebilir.
Evet. Tasarım, prototip ve handoff paketi olarak teslim edilebilir; geliştirmeyi sizin ekibiniz veya TEVQON yürütebilir.
Evet. Mevcut siteyi, içeriği ve hedefleri inceleyip yeniden yapılandırırız.
Evet. Başlık hiyerarşisi, semantik yapı, okunabilirlik ve sayfa mimarisi SEO-aware kurgulanır. Teknik SEO uygulama geliştirme aşamasındadır.
Evet. Kontrast, tipografi, odak halleri, klavye ve semantik hiyerarşi tasarım kararlarının parçasıdır. Kesin uyumluluk iddiası yerine accessible-by-design yaklaşımı izleriz.
Evet. Dil genişlemesi, metin uzunlukları ve yön dikkate alınarak layout kurgulanır.
Evet. Ürün keşfi, listing, detay ve checkout deneyimini satış odaklı tasarlarız.
Evet. Renk, tipografi, boşluk, bileşenler ve durumlar tek bir sistem olarak kurulur.
Yeni bir web deneyimi
İşinizi, hedef kitlenizi ve markanızı anlayarak size özel bir web deneyimi tasarlayalım.