İnterfeysdən kənar dizayn

Əlavə etməyiniz lazım olan bütün dizayn elementləri yalnız istifadəçi interfeysləri (UI), istifadəçi təcrübəsi (UX) və qarşılıqlı əlaqələr (IxD) deyil.

Bir istifadəçi səyahətini planlaşdırdınız, ekranları dizayn etdiniz və interaktiv animasiyalarda prototipləşdirdiniz.

Əslində yox. Bir səviyyə aşağı düşdükdə nəzərə alacaq bir çox şeyin olduğunu görəcəksən. Və yalnız istifadəçi interfeysindəki düymələrin fərqli vəziyyətlərindən danışmıram!

Bütün bu mövzu İbtidai sinif üçün böyük bir motivator idi. Bu yazıda kömək edən müxtəlif dizayn elementlərini nəzərdən keçirəcəyik:

Bu rolları yerinə yetirən birini tanıyırsınızsa - və dini / davamlı oxu mühitində məqalə tipi deyilsinizsə - niyə bu məqaləni onlarla bölüşməyək?

məzmun

  1. Beş (əlavə) dizayn elementimizi təqdim edin
  2. Bir nümunə işində hər bir elementdən istifadə edin
  3. Hər şeyi bir istifadəçi axınına bağlayın

1. Beş (əlavə) dizayn elementi

Dizayn elementi? Dizayn elementi termini dizayn dilinin və ya texnologiyanın, dizaynın və ya proqramın nomenklaturasının bir hissəsi deyil. Hər şey daxil olmalıdır və əhatə olunmalıdır: "Rəqəmsal məhsul və xidmətlərin dizaynı və analizinin bir hissəsi olan şeylər" -

... Əlbətdə ki, dizayn elementi dildən daha yaxşı çıxır.

Dizayn elementləri və onların rolları

Layihənizdə nəzərə almalı olduğunuz bir çox element var. Yalnız beşinə diqqət yetirəcəyik.

Gördüyünüz kimi, bu nümunələr texniki deyil! İş və dizayn tərəfində rahat oturursunuz.

2. Case Study: Qeyd axını

Bir nümunə nümunəsi olaraq standart bir təyyarə axını istifadə edək. Hər bir dizayn elementi üzərində quraraq dizayn elementlərinin hər birini addım-addım araşdıracağıq.

Kontekstdəki interfeyslər (1/5)

Tamam, iki ekran bağladıq ... bitmiş və tozlanmış?

Yox! Yəqin ki, bir interfeys yoxdur. İstifadəçilər qeydiyyatdan keçdikləri zaman bir e-poçt alır?

Arayüz axını və ya seriyası mütləq qaydada olmalı deyil. Unutmayın, tətbiqetmənin necə işləyəcəyini bildirməyə çalışırsınız, yalnız bir və ya iki ssenarini prototiplə simulyasiya etmirsiniz.

Darıxdığınız hər bir əlavə addım hava limanının təhlükəsizliyi ilə geyinməyə çalışdığınız hər əlavə gödəkçə kimidir. Hər hansı əlavə sual bir çox sual doğuracaqdır. Əlbətdə, buradan və ya oradakı birindən yaxa qurtara bilərsən, ancaq bunu bir neçə dəfə etmək səni ciddi problemlərə düçar edəcəkdir.

Əlavə "qeyd e-poçtu" addımının lövhədə yarada biləcəyi bir neçə sual:

  • Bunun üçün bir şablon varmı?
  • Hansı sistemdən gəlir? (İnterkom?)
  • Bu, digər müştərilərlə ünsiyyətə necə uyğun gəlir?
  • E-poçtun yaradılmasına kim cavabdehdir?

Kontekstdəki istifadəçi növləri (2/5)

İstifadəçiləriniz kimdir, UX tədqiqatı və marketinqində əsas mövzudur. Geliştiricilər və dizaynerlər üçün istifadəçilərinizin kim olduğunu və məhsulunuzda nə etməyə icazə verildiyini təyin etmələri vacibdir.

Nümunəmizdə, ziyarətçinin daxil olduqdan sonra istifadəçi olması o qədər sadə ola bilər. Yəqin ki, daha mürəkkəb olacaq. Bizim nümunəmizdə bir istifadəçi daxil olur və sonra tam xüsusiyyətli Pro planının yeddi günlük sınaq müddətini alır.

Bu, aşağıdakıların təmin edilməsi lazım olan daha çox işlərə və suallara səbəb olur:

  • Pro istifadəçi pulsuz istifadəçinin edə bilməyəcəyi nə edə bilər?
  • İstifadəçi girişdən yeddi gün sonra nə baş verir?
  • Bu yalnız qısa müddətli bir promosyondur? Digər planları genişləndirmək üçün kifayət qədər çevik olmalıdır?
  • Bütün ziyarətçilər sınaq versiyasına və ya yalnız düzgün e-poçt adresləri olan ziyarətçilərə giriş əldə edirlər?

Bu suallar bir çox fərqli funksiya, proses və interfeysə aiddir. Hər istifadəçi növü üzrə bunun çoxunu təyin etmək yaxşıdır.

Kontekstdəki formalar (3/5)

Forma istifadəçi interfeysində orada tonlarla məqalə var, ancaq hansı sahələri daxil edəcəkləri və necə işlədikləri barədə çox şey yazılmayıb.

Bizim nümunəmizdə ilk addımda bir forma var.

Fərdi sahələrin UI vəziyyətlərindən daha çox şey var! Xahiş edirəm aşağıdakılara diqqət yetirin:

Bu detalları anlamaq pula və vaxta qənaət etməyin ən asan yoludur. Bu dizayn mərhələsində şeyləri dəyişdirmək çox xərc tələb etmir, ancaq kodda olduqdan sonra nisbətən bahalıdır.

Kontekstdəki məlumatlar (4/5)

Akışımızda istifadəçi formanı doldurur, Göndər düyməsini vurur və sonra gözəl təyyarə səhifəsini görür. Başqa nə baş verir?

Məlumat daxil edilir, saxlanılır, istifadə olunur və dəyişdirilir. Bunların bir hissəsi texniki sahəyə düşür, lakin dizayn baxımından düşünüləsi çox şey var.

Məlumat axınınızdakı məlumatlarla əlaqədar yarana biləcək bəzi suallar:

  • Hansı istifadəçi məlumatlarını saxlayırıq? Formada nə var?
  • Bunu şirkətin CRM-nə necə əlavə edə bilərik?
  • Bu məlumatı təyyarə ekranını fərdiləşdirmək üçün istifadə edə bilərikmi?

"Müştəri Etiketi" adlı məlumat dizayn elementini daxil edək. Bu şəkildə qeydiyyatdan keçdikdən sonra bir istifadəçini etiketləyə bilərik ki, onlara düzgün mesajları göndərək. Bu istifadəçi bölməsində yuxarıda göstərilən yeddi günlük sınaq əlaqələndirmək üçün istifadə edilə bilər.

Ərizələrdə məlumatlarla bağlı hər zaman çox şey var. Şirkət və istifadəçilər üçün vacib olan məlumatların qayğısına qalırıq. Tələb olunan bəzi məlumatlar sizə aydın görünə bilər, lakin eyni məzmunda olmayan dizaynı həyata keçirən şəxsə aydın görünə bilməz.

Məsələn, şirkətinizin CRM-də istifadəçilərinizin poçt kodlarını toplamağa ehtiyac ola bilər. Bunu layihədə yazmırsınızsa, qərar qəbul etməyi mahiyyət etibarilə bir başqasına və ya özünüzə bir revizyon kimi tapşırırsınız.

Kontekstdə qaydalar (5/5)

Qaydalar dizaynlarınızı təşkil etməyə kömək edir. Bunlar dizayn etdiyiniz sistemin məhdudiyyətlərini, niyyətlərini, alternativ yollarını, kənar vəziyyətlərini və həll yollarını təyin etmək üçün istifadə olunur.

Bir qayda olaraq nə vaxt təsnif edilir? Məntiq və ya şərti bir testin tətbiqi ilə əlaqəli hər şey ümumiyyətlə ən yaxşı şəkildə tutulur. İstifadəçi hərəkətləri şərtləri ehtiva etməməlidir, çünki bu povesti pozur və axını daha çətin başa düşür.

Endirim kodunun detallarını bir neçə sətirdə endirim kodunun necə işlədiyini müəyyənləşdirən bir qayda olaraq ödəmə zamanı endirim kodunun təfərrüatlarını təyin edə bilərsiniz. Portfelin nömrələri və əlavələri olan bir çox səhifədə gözlənilən gəlirinin kompleks hesablamasını təyin etmək üçün bir qaydanı da istifadə edə bilərsiniz.

Aşağıdakı nümunədə bir qayda istifadə etdik:

"Qeydiyyatdan keçən müştərilərin olub-olmadığını yoxlayın" qaydasını əlavə etdik. Bu qayda, e-poçt ünvanlarının korporativ bir müştəri hesabından olduğu təqdirdə yeni bir qeydiyyatdan fərqli bir təyyarə təcrübəsi əldə edib etməyəcəyini yoxlamaq vəziyyətini əhatə edir.

Standart qeydiyyatdan keçmə prosesi xaricində olduğu üçün tətbiq etmədən əvvəl müzakirə etmək və dizayn etmək vacib olduğu üçün burada müəyyənləşdiririk.

Şəxsən mən hiss edirəm ki, təkrarlanmaya olan kor inam bir çox lazımsız yenidən işlənmələri gizlədir. Bu nümunədəki hərəkəti qaydalar olmadan həyata keçirirsinizsə və daha sonra əlavə etməyiniz lazımdırsa, bu "təəccüblü UX kəşfi" idimi, yoxsa bir dəyişiklikdir?

3. Hər şeyi bir-birinə bağlayın

Nə var? Yaxşı sual, bu əlavə dizayn elementləri çox işdir! Ancaq əlavə etdiyiniz hər hansı bir element ən azından qənaət edə bilər:

  • Görüşmək,
  • Vəsiqə kartı,
  • Elektron poçt,
  • Mövzu,
  • və ya işə başlamazdan əvvəl monitorunuzda hirslənmiş post-it qeydləri.

Bizim işimizdə yalnız səkkiz element müəyyən etdik və ən azı 28 sual qənaət etdik. Bu suallar (oxuyun: reviziya) komandanızdakı bir sıra şəxslərdən gələ bilər: inkişaf etdiricilər, məhsul menecerləri, marketoloqlar və nəhayət müştərilər.

Əlbəttə ki, bu sualların çoxunu iş və texniki tələblər sənədlərində əks etdirə bilərdiniz, amma bu daha az əyləncəlidir. Həm də daha az təsirli olur.

Niyə işləyir

Meymun beynimiz hekayələri idarə etmək və xatırlamaqda yaxşı görünür. Yalnız istifadəçilərdən istifadə etdikdə, bütün dizayn elementləri aydın olur.

Yaxşı! Və buna görə çox vaxt aparırıq! Eyni məzmunu əhatə etmək istəyirsinizsə və bütün həyatınızı Sketch dizaynında keçirtmək istəmirsinizsə, İlkin alətimizi sınayın.

Əvvəldə dediyim kimi, bu mövzu İbtidai məktəb yaratmağımızın əsas səbəblərindən biri idi. Bu elementlərin rəqəmsal məhsul dizaynında birinci dərəcəli vətəndaşlar olduğunu bilirik. (Və belə deyilsinizsə, bu çox yaxşıdır - bu dizayn elementləri istifadə etdiyinizə baxmayaraq hələ də dəyərlidir).

Güman edirəm məqalələr üçün tövsiyə olunan 4 dəqiqəlik diqqət müddətini keçdim. Hələ də buradasansa, mənə 24-46 alqış və şərh ver. Şərhlərdə istənilən suala cavab verəcəyimə söz verirəm!