فرم طراحی مستر کلاس – مجله سر و صدا

درباره نویسنده

آدام سیلور یک طراح تعامل متمرکز بر سیستم های طراحی و طراحی فراگیر است. او دوست دارد به سازمان ها در ارائه محصولات و خدمات کمک کند تا
اطلاعات بیشتر در مورد آدم

نوشتن محتوای این کارگاه حدود شش ماه طول کشید و خاموش شد. پس از تأملات فراوان ، من تصمیم گرفتم ساختار آن را مانند آنچه در کتاب خود با عنوان “الگوهای طراحی فرم” می سازم ، تنظیم کنم.

این یک کارگاه 4 روزه بود که به دو بخش 45 دقیقه ای تقسیم شده بود ، با 15 دقیقه وقفه و پس از آن 30 دقیقه پرسش و پاسخ با تکالیف اختیاری بین روزها. ما هر روز برای حل یک مشکل بزرگ تصمیم می گیریم. این راهی برای نزدیک شدن به مسئله مانند آنچه در زندگی واقعی انجام می دهیم فراهم کرد: با تجزیه و تحلیل و بحث در مورد گزینه ها قبل از رسیدن به راه حل خوب.

به طور کلی ، این یک تجربه سرگرم کننده بود. من چیزهای زیادی آموختم و اوقات بسیار خوبی را برای تدریس و گپ زدن با همه داشتم. من در حال حاضر منتظر نسخه بعدی هستم که به طور آزمایشی برای تابستان 2021 برنامه ریزی شده است.

برخی از نکات برجسته هر روز

در اینجا خلاصه سریع هر روز شامل برخی از نکات برجسته ارائه می شود.

روز اول: میخ زدن اصول طراحی فرم

در روز اول ، ما یک فرم ثبت نام ساده را از ابتدا طراحی کردیم. این یک روش عالی برای ناخن زدن به اصول طراحی فرم است. این موارد مانند موقعیت یابی، فرم ها و انواع ورودی را شکل دهید. در پایان روز 1 ، ما یک فرم ثبت نام برای خود داشتیم که اصول آن را پوشش می داد و فرم را برای کاربران ساده تر می کرد.

نکته برجسته من در این جلسه جلسه بود پروتکل سوال ورزش. به جای تمرکز بر چگونگی صرفه جویی مصنوعی در فرم ها (با استفاده از مواردی مانند برچسب شناور ، راهنمای ابزار ، برچسب های تراز چپ و متن محل نگهدارنده) ، ما از یک صفحه گسترده استفاده کردیم تا بدانیم چرا هر س everyالی پرسیده می شود و بهترین راه برای استخراج پاسخ.

برای فرم ثبت نام ما ، این به معنای تجزیه و تحلیل دقیق درخواست نام ، آدرس ایمیل و رمز عبور کسی است. و در پایان تمرین تعداد قسمتهای فرم را به نصف کاهش دادیم و برای موارد باقی مانده توجیه روشنی داشتیم.

روز 2: اعتبار سنجی فرم و نوشتن پیام های خطای خوب

در روز دوم ، ما فرم ثبت نام خود را به خوبی طراحی کردیم و به دو روش بررسی کردیم که چگونه به کاربران کمک کنیم تا از خطاها بازیابی کنند:

1. ما تصمیم گرفتیم که چه زمانی فرم ها را تأیید کنیم و چگونه پیام های خطا را نمایش دهیم.
2. ما یاد گرفتیم که چگونه پیام های خطای واضح ، موجز ، سازگار و خاص بنویسیم که به کاربران کمک می کند تا به سرعت مسیر خود را بازگردانند.

نکته قابل توجه من در این جلسه تمرین برای بود پیام های خطا را دوباره طراحی کنید در فرم عضویت بسیار مجله Smashing Magazine.

سوفی کولبرت، یک طراح محتوا که در این کارگاه حضور داشت ، داوطلبانه پیام های خطای جدید خود را در مورد توجیه منطق خود برای هرکدام به اشتراک گذاشت.

هم پیام ها و هم منطق آن عالی بودند و من فکر می کنم این گروه از نتایج بسیاری بهره مند شدند زیرا می توانستند از طرز فکر طراح محتوای سوفی اطلاعاتی کسب کنند.

روز 3: طراحی مجدد فرم پرداخت واقعی در دنیای واقعی

روز 3 ، ما جریان پرداخت ASOS را از ابتدا دوباره طراحی کردیم. این شامل پرداخت مهمان (تجربه اولین بار) و تسویه حساب به عنوان شخصی با حساب (تجربه استفاده تکرار) است. ما زمینه های زیادی مانند استفاده از زبانه ها ، آکاردئون یا دکمه های رادیویی را تحت پوشش قرار دادیم. و همچنین بررسی پرداخت های یک صفحه ای در مقابل پرداخت های چند صفحه ای را بررسی کردیم.

نکته قابل توجه من در این جلسه این بود که روند طراحی مجدد چندین تعامل، چالش های طراحی محتوای جدید و طراحی خدمات را نشان داد. به عنوان مثال ، برگه هایی را که از کاربر می خواهند مشخص کند آیا حساب کاربری دارند یا نه ، تبدیل کردیم:

و ما آنها را دوباره به فرم با دکمه های رادیویی طراحی کردیم:

و این مسئله این مسئله را آشکار کرد که در زندگی واقعی ، انتخاب ها به ندرت باینری هستند. بنابراین من از گروه پرسیدم گزینه گمشده چیست و آنها به درستی گفتند: “اگر کاربر به خاطر نمی آورد چه؟”

بنابراین حتی اگر ما در وهله اول به این مسئله به عنوان یک مشکل طراحی تعامل نگاه می کردیم ، این مسئله به مسئله طراحی محتوا و خدمات تبدیل شد.

همه این مشکلات یکی از فرم های UX را به خوبی در خود قرار داده است: “با سایر بخش ها دوست شوید”. ما به عنوان طراح ، باید به طور موثر با ذینفعان سراسر سازمان کار کنیم تا مطمئن شویم که از پیچیدگی های حداکثر ممکن جلوگیری می کنیم. و این دوباره جایی است که پروتکل سوال واقعاً درخشان است.

روز چهارم: استفاده از نحو مختصر و طراحی فرم های طولانی و پیچیده

روز 4 به دو قسمت تقسیم شد که به ترتیب معکوس در مورد آنها بحث خواهم کرد.

در قسمت دوم ، ما الگوهای مختلفی را بررسی کردیم که به کاربران کمک می کند تا طولانی و طولانی را پر کنند اشکال پیچیده – نوعی از فرم ها که تکمیل آنها روزها ، هفته ها یا حتی ماه ها به طول می انجامد. من واقعاً منتظر اجرای این کار بودم زیرا چالش های طراحی پیرامون این موضوع جالب توجه و زیر پا گذاشته نمی شوند.

در قسمت اول ، فرم ثبت نام Smashing Magazine را با استفاده از نحو مختصر دوباره طراحی کردیم.

نکته برجسته من در این جلسه این بود که ویتالی ، آقای مجله Smashing Magazine ، به عنوان سهامدار تجارت ما معرفی شد. این گروه از او س questionsالاتی کردند تا دلیل این که فرم به چه شکلی طراحی شده است را بشناسند و از او س askingال کنند که چرا س certainالات خاصی پرسیده شده است.

در اینجا چند نمونه هستند:

• سوفی او پرسید چرا حوزه کشور خواسته شده است ویتالی گفت که این به کارهایی که کاربر انجام می دهد بستگی دارد. اگر کاربر در حال خرید کتابی است ، باید بدانیم که کتاب به کجا می رود. و مالیات این کتاب براساس کشور مقصد است. ‘ این منجر به حذف فیلد و درخواست این اطلاعات هنگام خرید کتاب توسط شخص می شود – یا فقط در توضیحات متنی درباره اینکه چرا ما این اطلاعات را درخواست می کنیم ، واضح تر است.
• میلوس لازارویچ نیاز به “آیا گربه ها را دوست داری؟” کادر انتخاب و دانا کوترو و ژاکلین زیگلر لذت بردن از بازیگوشی کادر تأیید. اما من شادی را که برای برخی از افراد به ارمغان می آورد در برابر خطر بیگانگی افرادی که مثلاً از نظر دیجیتال کمتر در معرض خطر هستند و یا برای دسترسی به محتوا عجله دارند ، سنگین می کنم.
• اما استوتز زیر سوال بردن استفاده از اعتبار سنجی زنده با توجه به همه مسائل قابل استفاده بودن که در آن بالا میآید و ویتالی مشتاق کشف بلافاصله اعتبار سنجی زمینه های ارسال شده در عوض بود.

برداشت کلی من

برای من ، کارگاه در مجموع بسیار خوب پیش رفت و من با روند کار و بازخوردی که از شرکت کنندگان دریافت کردم ، دستپاچه شدم. همه بسیار دوستانه بودند و در برابر چند مشکل فنی که روز اول داشتم تحمل می کردند (با تشکر دوباره ، همه!) اجرای کارگاه از راه دور بر روی بزرگنمایی مشکلاتی دارد (ما در مورد اینکه چگونه به طور تصادفی روز 1 جلسه را به طور اتفاقی وحشت زده جلسه را ترک کردم صحبت نخواهیم کرد) ، اما در واقع من جنبه از راه دور در کل مفید است.

به عنوان مثال ، اتصال همه به زوم به این معنی بود که در حالی که برای شرکت کنندگان س questionsال می پرسید ، یکپارچه است صفحه نمایش آنها برای زنده کردن مشکلات

من هم واقعاً لذت بردم ملاقات با مردم در سراسر جهان ، چیزی که فکر می کنم با کارگاه های حضوری دشوار باشد. همچنین ، در طول تعطیلات ، سریعاً می خواستم بچه هایم را در رختخواب قرار دهم ، بنابراین تصور می کنم که برای حاضران نیز خوب باشد.

اما یک چیز وجود دارد که کاش زودتر می دانستم. من نگران بودم که با وجود چنین گروه عظیمی از مردم (به طور دقیق 81 نفر) ، اجازه دادن به مردم برای صحبت آزادانه در هرج و مرج باشد. در نتیجه ، در روز 1 ، سوالات گروه Google Doc مشترک در طول پرسش و پاسخ را خوانده و به آنها پاسخ دادم. این به این معنی بود که صدای دیگران شنیده نمی شد و مانع بیشتری بین من و گروه وجود داشت.

این چیزی است که من برای روز 2 اصلاح کردم و واقعاً تفاوت ایجاد کرد. خوب بود صدای مردم را بشنوید و افکار به قول خودشان و بیشتر باعث ایجاد گفتگوی آزاد می شود که در آن دیگران شروع به پاسخگویی به س questionsالات دیگران می کنند که من آنها را دوست دارم.

یادم می آید الکس پرایس یکبار پرید و در مورد تجربه خود در برخورد با فرم پیچیده ای صحبت کرد که لازم بود توسط افراد مختلف تکمیل شود.

آنچه برای دفعه دیگر تغییر خواهم داد

در حالی که برداشت کلی من از کارگاه بسیار مثبت بود ، مواردی وجود داشت که می خواهم برای دفعه بعدی اصلاح کنم.

1. اصول را نشان دهید ، اصول را یاد نگیرید

روز 1 قبل از پرداختن به جزئیات بیشتر در روزهای بعد ، بسیاری از اصول را پوشش داد ، اما آموزش برخی از این موارد کمی من را آزار داد ، زیرا فکر کردم بسیاری از شرکت کنندگان بسیاری از این مطالب را از قبل می دانند. بنابراین دفعه دیگر ، می خواهم اذعان کنم که برخی از افراد با دانش زیادی آمده اند و صحنه را به گونه ای تنظیم می کنند که “من اینگونه اصول را یاد می دهم” در مقابل “این نحوه یادگیری اصول است” – به لطف کارولین جارت برای این نکته

همچنین ، من احتمالاً از گروه می پرسم که آیا رویکرد طراحی فرم وجود دارد یا خیر تلاش کرد تا قانع شود هم تیمی ها در مورد این مطمئناً چیزی است که من قبلاً با آن دست و پنجه نرم می کردم.

2. تقسیم افراد در گروههای بزرگتر

یکی از این تمرینات شامل تقسیم افراد به گروههای 2 نفره با استفاده از اتاقهای بزرگنمایی بزرگنمایی بود ، اما از آنجا که افراد از سراسر دنیا به این کارگاه می آمدند ، برخی از افراد گوش دهنده قادر به شرکت در تمرینات نبودند.

به عنوان مثال ، بعضی از افراد واقعاً نیاز به استراحت ناهار داشتند زیرا منطقه زمانی آنها از من بالاتر بود. این بدان معناست که یک یا دو نفر که می خواهند شرکت کنند ، خود به خود در یک گروه قرار می گیرند. دفعه بعدی ، افراد را در گروه هایی با گفتن 4 قرار می دهم و مطمئن می شوم که این تمرینات همچنان ادامه دارند.

3. تمرینات گروهی بیشتری اضافه کنید

علی رغم مسئله ای که من به آن اشاره کردم ، تمرینات گروهی خوب کار کرد مردم از آنها لذت بردند و این ایده های جالب توجه شرکت کنندگان را برانگیخت. برخی از افراد پس از گفتن اینکه آرزو می کنند تمرینات گروهی بیشتر باشد به من پیام دادند ، بنابراین هدف من انجام این کار است.

یک پوستر از همه قوانین

همانطور که از طریق کارگاه حرکت می کردیم ، عقب می افتیم 40 قانون و اصول طراحی فرم که یک ساختار اضافی خوب برای جلسات به ارمغان آورد.

چند نفر از حاضران از من سال کردند که آیا من پوستری از همه قوانین دارم یا خیر – یا خیر – بنابراین اکنون یکی از آنها را ساخته ام.

بازهم از همه کسانی که برای همه مشارکتهایشان آمده اند تشکر می کنم. منتظر مورد بعدی هستم.

با تشکر از کارولین جارت نه تنها برای مرور جزئیات کارگاه من بلکه برای ویرایش این مقاله.

(vf ، او)