Mikro metin ve UX iletişimi
1) Mikrotekslerin ne olduğu ve neden ihtiyaç duyulduğu
Mikrokopi - arayüzdeki kısa, bağlamsal ifadeler: alan başlıkları, istemler, yük durumları, hatalar, onaylar, CTA düğmeleri, boş ekranlar vb. Görevleri belirsizliği ortadan kaldırmak, eylemi hızlandırmak ve bilişsel yükü azaltmaktır. İyi mikro metin:- "Şimdi ne olduğunu've" sonra ne yapılacağını "açıklar;
- Hataları ve desteği azaltır
- Dönüşüm ve güveni arttırır.
2) Temel ilkeler
1. Netlik> wit. belirsizlik veya argo yok.
2. Bağlamsallık. Burada ve şimdi tam olarak neyin yararlı olduğunu yazıyoruz.
3. Kısalık. Anlamdan ödün vermeden gereksiz kelimeleri kaldırıyoruz.
4. Aktif ses ve eylem fiilleri. Kaydet, Devam Et, Belge Gönder.
5. Özellikler ve yerler. Ne, neden, nasıl düzeltileceği, ne kadar süreceği.
6. Terimler dizisi. Bir terim, ürün boyunca bir anlamdır.
7. Marka sesi ve durumun tonu. Arkadaş canlısı, ama aşinalık olmadan; Stresli adımlarla - nötr ve sakin.
8. Erişilebilirlik. Açık dil, yüksek sesle okunabilirlik, ekran okuyucularla uyumluluk.
9. Önce yerelleştirme. Dize uzunluğu, sayılar, zaman için tasarım belirteçleri; Kültürel açıdan hassas şakalardan kaçınmak.
10. Etik ve sorumluluk. Koşulların şeffaflığı, dürüst beklentiler, manipülasyon yok.
3) Mikro metin noktası haritası
Gezinme ve CTA: öğe adları, düğmeler, devre dışı durumlar.
Formlar ve CCM/kayıt: etiketler, yer tutucular, maskeler, istemler, satır içi doğrulama, hatalar, onaylar.
Boş durumlar ve "sıfır" ekranlar: ne olduğu ve nasıl başlatılacağı.
Durumlar ve ilerleme: indirmeler, kuyruk, adımlar, bekleme süresi.
Sistem bildirimleri: tost, afiş, kabartmalar, e-posta/gelen kutusu.
Arama ve filtreler: örnek sorgular, sıfır sonuç, sıralama.
Ödemeler/sonuçlar: veri gereksinimleri, son tarihler, komisyonlar, limitler.
Ayarlar ve güvenlik: şifreler, 2FA, oturumlar, risk uyarıları.
Arayüz yardımı: ipuçları, araç ipuçları, SSS ekleri, yardım bağlantıları.
4) Anahtar bölge desenleri (örneklerle)
4. 1 CTA ve Eylem Adları
İlke: düğme = kullanıcı eylemi + nesne.
Önce: Tamam - Sonra: Değişiklikleri Kaydet
Önce: "Daha fazla bilgi edinin" - Sonra: "Bonus kurallarını okuyun"
Önce: "Gönder" - Sonra: "Belge gönder"
İyi: kısaca, özellikle yerinde. Kötü: soyut, şaka, belirsiz.
4. 2 Etiketler ve yer tutucular
Etiket gereklidir; Yer tutucu bir format örneğidir.
Önce: yer tutucu "Ivan Ivanov" etiketli bir etiket olmadan - Sonra: etiket "TAM ADI", yer tutucu "Ivan Іvanov".
Format beklentileri: "DD. MM. YYYY", "Min. 8 karakter, 1 rakam"
4. 3 Satır içi doğrulama ve hatalar
Hata mesajı formülü: yanlış olan nedir++ nasıl düzeltilir (neden/kısıtlama).
Önce: "Hata 400" - Sonra: "Geçersiz tarih biçimi. DD kullan. MM. YYYY"
Önce: "Yüklenemedi" - Sonra: "Dosya çok büyük (maks. 10 MB). Lütfen daha küçük bir dosya seçin.
Açmak/Kilitlemek için: Gereksinimleri Göster bağlantısını yan yana ekleyin.
4. 4 Boş durumlar
Amaç: Değeri açıklamak ve eylem önermek.
Şablon: "Burada [sonuç/hikaye] [eylem] olur olmaz. [Adım Düğmesi]"
Örnek: "Henüz kayıtlı bir ödeme yönteminiz yok. Bir kart ekleyin - bu ödemeleri hızlandıracaktır. [Harita Ekle]"
4. 5 İndirme, ilerleme, bekleme
Neler olduğunu ve ne kadar süreceğini bildirin: "Belgeleri kontrol ediyoruz (2 dakikaya kadar)".
Bir alternatif sunun: "Pencereyi kapatabilirsiniz - her şey hazır olduğunda sizi bilgilendireceğiz".
4. 6 Sıfır arama sonuçları
Örnek: "Hiçbir şey bulunamadı "canlı blackjack. "Blackjack'i deneyin veya" Provider: X "filtresini kaldırın. [Filtreleri Sıfırla]"
4. 7 Bildirimler (tost/afiş/pooches)
Başarı: "Başvuru yapıldı. Karar hakkında sizi e-posta ile bilgilendireceğiz".
Bilgi: "Limiti artırmak için adres doğrulaması gereklidir".
Dikkat: "Oturum 1 dakika içinde sona eriyor. Yenilemek mi? [Yenile] [Çık]"
Hata: "Ödeme banka tarafından reddedildi. Başka bir yöntem deneyin veya bankanızla iletişime geçin.
4. 8 Ödemeler, limitler, son tarihler
Komisyonlar/terimler hakkında açıkça yazın: "1 komisyonu. %5'i sağlayıcı tarafından tutulur," "Ödeme - 15 dakikaya kadar"
Arızaların nedenlerini açıklayın: "Yöntem, sağlayıcı kuralları nedeniyle bölgenizde mevcut değildir".
4. 9 Güvenlik ve hassas adımlar
Nötr ton, sıfır şaka.
Örnek: "Yeni bir cihazdan bir giriş fark ettik. Sen misin? [Evet, benim] [Hayır]. '
5) Ton ve stil: duruma göre ayarlama
Normal akış: samimi, özlü.
Öğrenme/onboarding: destekleyici ve motive edici.
Stres/hata/ödeme: tarafsız, sakin, spesifik.
Yasal/koşullar: resmen şeffaf, pazarlama vaatleri olmadan.
- Kullanıyoruz: "Lütfen", "hazır", "endişelenmeyin", "kontrol edin".
- Kaçınıyoruz: "oh", "oops", "hack", "magic", alaycı, küçültücü.
6) Yerelleştirme ve uluslararasılaştırma
Satır uzunluğu marjını ayarlayın (DE/UK daha uzun).
Sayılar/Para Birimleri/Tarihler - yerel olarak biçimlendirin.
Mizah/metaforlardaki anlamı şifrelemeyin.
Dillere göre terimler ve ton haritası sözlüğü tutun (her durum için örnek ifadeler kümesi).
7) Kullanılabilirlik (A11y)
Hatalar ve önemli durumlar - aria-live.
WCAG seviyesinde kontrast ve okunabilirlik.
Anlam/aria-label etiketinde, sadece yer tutucuda değil.
Simgeler için metin eşdeğerleri: "Delete", "Hide password".
Sekme sırası = anlam sırası.
8) İçerik süreci ve tasarım sistemi
İçerik boru hattı: Kısa, taslak, UX incelemesi, yasal/uyumluluk (gerekirse), yerelleştirme, testler, sürüm.
Tasarım sistemindeki mikrokopi bileşenleri:- Durum kütüphaneleri (başarı/bilgi/dikkat/hata)
- Alan türüne göre hata desenleri
- CTA isimlerine göre rehber;
- Ton-harita ve sözlük;
- uzunlukta "dağıtıcılar" (durumlar için maks.
- Metin sürümü oluşturma: satırları kodun/bileşenlerin yanında saklar, tuşları ve açıklamaları kullanır.
9) Metrikler ve deneyler
Anahtar metrikler: adım dönüştürme, CTA TO, tamamlanma süresi, türe özgü hata oranı, komut dosyası için NPS/CSAT, konuyla ilgili destek çağrılarının sıklığı.
Araştırma: UX görüşmeleri, kullanılabilirlik testleri, yüksek sesle okuma, kör nokta tespiti için göz izleme, boş durum tıklama haritası analizi.
Mikrokopi A/B testleri: bir seferde bir semantik faktörü test edin (eylem fiili, terim özgüllüğü, hata formülasyonu).
10) Anti-desenler
Kritik adımlarda mizah ("upsik!" ödeme hatası durumunda).
Özet Bir eylem nesnesi olmadan CTA'lar ("OK", "Next").
Çevirisiz teknik kodlar ("Hizmet mevcut değil" yerine "Hata 500").
Etiket yerine yer tutucu.
Gizli koşullar ve makul olmayan beklentiler (gecikmeler olduğunda "Anında").
Bir sonraki adım olmadan "sıfır" boş durumlar.
Pasif teminat ve kişisel olmayan yapılar ("doldurulmalıdır").
11) Cümle kalıpları (alınabilir ve eklenebilir)
Form hataları:- "Lütfen + 380 formatında bir telefon numarası girin"...
- "Şifre çok kısa. En az 8 karakter"
- "Belge bulanık. Daha net bir fotoğraf yükleyin"
- «Tamam! Belgeleri inceleyeceğiz (2 dakikaya kadar) ve bir bildirim göndereceğiz"
- "Ödeme kabul edildi. Makbuz e-posta ile gönderildi"
- "İlk ikmalden sonraki işlem geçmişi burada görünecek. [Doldur]"
- "Tedarikçiyi bağlıyoruz... Genellikle 30 saniyeye kadar sürer"
- "Bilinmeyen bir yerden girme girişimini engelledik. Bu sizseniz - başvuruda onaylayın"
12) Kontrol listeleri
Mikro metni yayınlamadan önce:- Kullanıcının bundan sonra ne yapması gerektiği açık mı?
- Özellikleri var mı: biçim, limit, terim, neden/sonuç?
- Terimler sözlükle uyuşuyor mu?
- Ton duruma uygun mu?
- Mesaj yüksek sesle ve 320 px ekranda okunabilir?
- Kullanılabilirlik: etiketler, arya nitelikleri, odak, kontrast.
- Seçenek yerelleştirme için hazır mı (kültürel tuzaklar olmadan)?
- Mesaj nedenini açıklıyor mu?
- Bir düzeltme önerir?
- Kullanıcıyı suçlamıyor mu?
- Gereksiz teknik detayları ortaya çıkarmaz mı?
13) Örneklerden önce/sonra
1. Ödeme reddedildi
To: "Ödeme hatası"
Sonra: "Ödeme banka tarafından reddedildi. Lütfen başka bir kart deneyin veya bankanızla iletişime geçin. Ücret tahsil edilmedi"
2. Belirsiz düğme
Önce: "Devam" (tam olarak ne olduğu belli değil)
Sonra: "Kimlik onayına git"
3. Sıfır arama
Önce: "Hiçbir şey bulunamadı"
Sonra: "Rulette canlı bir şey bulunamadı. "Sadece yüksek limitli "filtreyi kaldırın veya" ruleti deneyin ". "[Filtreleri Sıfırla]"
4. Boş cüzdan
Daha önce: "Burası boş"
Sonra: "Başlamak için, bir kartı veya cüzdanı bağlayın. Bu, yenileme ve ödemeleri hızlandıracaktır. [Ödeme Yöntemi Ekle]"
14) Mikrokopinin ürün çalışmalarına gömülmesi
Metni tasarım ve mantıkla aynı anda planlayın.
"Sıra bankasını" bilgi havuzunda ve tasarım sisteminde tutun.
Ekranların kopyalarındaki metinleri test etme aşamasını belirleyin.
Belge kararları: formülasyonun neden seçildiği, hangi hipotezlerin test edildiği.
Kısa hile sayfası
Anlamı - Eylem - Kelime. Önce yapılması gerekenler, sonra nasıl söyleneceği.
Bir ekran bir hedeftir. Mikro metin, adımın amacına hizmet eder.
Daha fazla bağlam - daha az destek. Zamanında ve davada açıklayın.
Kelimeleri UI ile aynı şekilde test edin. Metinler arayüzün bir parçasıdır, dekorasyonun değil.