معماری اطلاعات

اینکه صفحه چه شکلی می‌گیرد. این پیش از هر رنگ و هر فاصله تصمیم گرفته می‌شود.

صفحه‌های دیگر این بخش به پرسش‌هایی دربارهٔ قطعه‌ها پاسخ می‌دهند. این صفحه به پرسشی پاسخ می‌دهد که پیش از آن‌ها می‌آید: با این همه چیزی که باید روی صفحه جا بگیرد، خواننده برای چه آمده و کدام چیدمان می‌گذارد کارش را بکند؟

وقتی به کار می‌آید که صفحه‌ای را آغاز می‌کنید که باید چند شیء، چند وضعیت و نسبت‌های میانشان را با هم نگه دارد: یک کنسول، یک داشبورد، یک پنل مدیریت، یک میز کار، یک صفحهٔ پایش. نه یک صفحهٔ فرود و نه فرمی با یک تبدیل واحد؛ سرنوشت آن‌ها را اقناع تعیین می‌کند، نه اینکه کسی در انبوه اطلاعات درست داوری کند یا نه.

کاملِ داده یعنی طراحی‌شدنِ صفحه نیست. صفحه‌ای می‌تواند همهٔ فیلدهایی را که API برمی‌گرداند نشان دهد، با فیلتر و برچسب وضعیت و عملیات گروهی، و خواننده باز هم نداند اول به کجا نگاه کند. آنچه کم است اطلاعات نیست، ترتیب است.

سه پرسش پیش از هر مؤلفه

1. آن یک چیزی که خواننده در بدو ورود باید ببیند چیست؟ این اطلاعات اصلی صفحه است.
2. برای فهمیدنش چه چیز دیگری باید دیده شود؟ منابع مرتبط، مدل‌های مرتبط، زمینه.
3. بعد از آن چه می‌کند؟ چیزی را داوری می‌کند، کاری انجام می‌دهد، یا به فکر کردن ادامه می‌دهد.

هر سه را پیش از باز کردن فهرست مؤلفه‌ها پاسخ دهید. صفحه‌ای که این سه پاسخ را روشن دارد کمتر شکل را اشتباه می‌گیرد؛ صفحه‌ای که از آن‌ها می‌گذرد سرانجام حول پاسخ API سامان می‌گیرد.

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

شکل از وظیفه پیروی می‌کند، نه از داده بازگشتی

بیشتر صفحه‌های بدشکل از این دو میان‌بر زاده می‌شوند:

• سرویس یک آرایه برگرداند، پس جدول شد.
• مسیر یک شناسه دارد، پس صفحهٔ جزئیات شد.

هیچ‌کدام دلیل نیست. همان شیء زیر وظیفه‌ای دیگر شکلی دیگر می‌گیرد: یک ایشیو هنگام جست‌وجو یک مجموعه است، هنگام رسیدگی یک جریان وضعیت، هنگام همکاری یک رشتهٔ گفت‌وگو، و هنگام ممیزی یک توالی رویداد. اینکه رکورد فیلد تاریخ دارد یعنی در داده تاریخی هست؛ یعنی این نیست که صفحه تقویم است.

انتخاب اسکلت بیان

چیدمانی را انتخاب کنید که با کمترین تبدیل ذهنی به پرسش اصلی پاسخ می‌دهد.

جفت‌هایی که جابه‌جا گرفته می‌شوند

• خط زمانی یا گام‌ها. خط زمانی می‌گوید چه رخ داده، به ترتیب. گام‌ها می‌گویند کجایید و چه در پیش است. شبیه هم‌اند و در زمان به دو سوی مخالف اشاره می‌کنند.
• کانبان یا فیلتر. کانبان وقتی درست است که جابه‌جا کردن کارت خودِ کنش باشد. اگر ستون‌ها شرط‌های فیلترِ ذخیره‌شده باشند، فیلتری ساخته‌اید که یک کشیدن خرج برمی‌دارد.
• تقویم یا خط زمانی. تقویم به اشغال و تداخل پاسخ می‌دهد، خط زمانی به ترتیب. تاریخِ درون رکورد میان این دو انتخاب نمی‌کند؛ پرسش انتخاب می‌کند.
• شبکهٔ کارت یا جدول. یا تصویر لنگر بازشناسی است یا نیست. اگر انتخاب با مقایسهٔ عدد انجام می‌شود، تصویر کوچکِ ستون اول همان فیلدهایی را دفن می‌کند که تصمیم به آن‌ها بند است.
• گراف یا فهرست مجاورت. گراف را تنها وقتی بکشید که خودِ مسیر یا انتشار مبنای داوری باشد. وگرنه فهرستی گروه‌بندی‌شده از بالادست و پایین‌دست سریع‌تر خوانده می‌شود.
• سند یا شبکهٔ فیلد. متنی که به ترتیب خوانده می‌شود متن می‌ماند. خرد کردن هر بند به یک کارت یا یک سطر کلید‑مقدار دقیقاً همان چیزی را از بین می‌برد که خواندنی‌اش کرده بود.

سه نما را فقط به این دلیل که می‌شود نسازید. هر نمای اضافی یعنی یک دست فیلتر دیگر، یک نگاشت وضعیت دیگر، و یک دسته کنش دیگر که باید هماهنگ بماند. دومی را وقتی اضافه کنید که کاربرد دوم واقعاً پرتکرار شده باشد، نه محض احتیاط.

جای هر گونه اطلاعات

هر واقعیت دقیقاً یک جای مرجع دارد. هر جای دیگر خلاصه یا ورودی‌ای می‌گذارد که به آن بازپیوند بدهد.

ترتیب خواندن

هویت صفحه
→ وضعیت کنونی یا استثنا
→ وظیفهٔ اصلی و کنش اصلی
→ اطلاعاتی که داوری لازم دارد
→ نسبت‌ها، تغییرها، شواهد
→ اطلاعات فرعی و کنش‌های کم‌تکرار

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

تراکم اطلاعات

تراکم یعنی اینکه در یک نگاه چقدر اطلاعاتِ به‌دردخور برای داوری برداشته می‌شود، نه اینکه در هر وجب چند کنترل جا شده. فشردن فاصله‌ها فقط تراکم بصری را بالا می‌برد و تراکم مؤثر را همان‌جا می‌گذارد؛ حذف فیلدهای بی‌ربط و آوردن مقایسه به یک جا آن دیگری را بالا می‌برد.

• در یک صفحه حداکثر دو سطح مجاور به کار ببرید. جدولی فشرده درون صفحه‌ای استاندارد اشکالی ندارد؛ اینکه هر ناحیه مقیاس خودش را اختراع کند اشکال دارد.
• فشردگی یعنی «کوچک کردن هم‌زمان متن و ناحیهٔ لمس» نیست. فاصلهٔ داخلی ظرف و ارتفاع سطر را می‌شود جمع کرد؛ خوانایی متن، حلقهٔ فوکوس دیدنی و اندازهٔ هدف اشاره‌گر را نمی‌شود.
• برای کاربران حرفه‌ای، مدیریت ستون، نمای ذخیره‌شده، عملیات گروهی و میان‌برها بیش از نشان دادن یک‌بارهٔ محتوای بیشتر به کار می‌آیند.

نگه داشتن زمینهٔ وظیفه

وقتی اسکلت انتخاب شد، تصمیم بگیرید محتوای پشتیبان کجا بنشیند:

مودال یک لایهٔ ناوبری نیست. هر چیزی که پیوند قابل کپی، تاریخچه، مقایسهٔ کنار هم، یا کاری که از بارگذاری دوباره جان به در ببرد لازم دارد، مسیر می‌گیرد.

ranui در این لایه چه می‌دهد

ranui دربارهٔ شکل صفحه عمداً موضعی ندارد: عناصر پایه و توکن می‌دهد، نه قالب صفحه. آنچه اینجا به دست می‌دهد این است:

• r-section برای نوارهایی که اسکلت به آن‌ها تقسیم می‌شود و r-card برای مدخل تکرارشوندهٔ واقعاً مستقل. هرگز کارت درون کارت؛ فیلدهای فرم را با یک عنوان یا یک جداکننده گروه کنید.
• r-tabs برای نماهای هم‌ترازِ یک شیء (گفت‌وگویش، بررسی‌هایش، تفاوتش)، نه برای ماژول‌های بی‌ربط؛ آن کارِ ناوبری است.
• r-disclosure-row برای آشکارسازی تدریجی، r-popover و r-dropdown برای زمینهٔ گذرا، و r-modal تنها برای آنچه جدول بالا به آن اجازه می‌دهد.
• r-state-dot برای وضعیت، همیشه همراه برچسبش: هرگز تنها با رنگ نه.
• r-skeleton تا وقتی نمای نخست بار می‌شود، r-progress برای هر کاری که آن‌قدر طول بکشد که کسی را به تردید بیندازد، و r-message برای نتیجه.

در ranui جدول، درخت، تقویم، کانبان و خط زمانی وجود ندارد. وقتی یکی را می‌سازید، به‌جای برپا کردن یک نظام بصری دوم، آن را روی توکن‌ها و راهنمای طراحی بسازید: فاصله از مقیاس، قلم بر پایهٔ نقش، رنگ از توکن‌های معنایی، و طراحی هر وضعیت دست‌یافتنی.

الگوهای نادرست

• هر فیلدی که سرویس برمی‌گرداند یک سطر جزئیات می‌شود، و هویت، وضعیت، نسبت‌ها و شواهد همه با یک وزن سر می‌رسند.
• سلسله‌مراتبی که از کارت و رنگ و فاصلهٔ تزیینی ساخته شده، بی‌آنکه چیزی دربارهٔ اینکه اول چه بخوانیم گفته باشد.
• چند کنش که سبک دکمهٔ اصلی را میان خود تقسیم کرده‌اند، یا کنشی کم‌تکرار که در ناحیهٔ عنوان نشسته.
• وضعیت و ویژگی و نسبت و تغییر که در یک جدول قاطی شده‌اند، طوری که هیچ‌جا مقایسه‌ای شکل نمی‌گیرد.
• گراف نسبت‌ها، آنجا که خواننده فقط می‌خواست نام و وضعیتی را ببیند.
• مودالی که جریانی طولانی، یک مقایسه، یا چیزی را حمل می‌کند که کسی پیوندش را خواهد فرستاد.
• یک جمله که در عنوان و خلاصه و نام زبانه و جدول تکرار می‌شود و هیچ‌جا چیز تازه‌ای نمی‌افزاید.

سیاههٔ بررسی پیش از انتشار یک صفحه

• اطلاعات اصلی، اطلاعات پشتیبان و کنش بعدی خواننده نوشته شده‌اند.
• اسکلت از دل پرسش انتخاب شده، نه از شکل پاسخ سرویس.
• صفحه یک مدل اصلی دارد و نماهای پشتیبان به‌جای رقابت با آن، در خدمتش‌اند.
• بی‌آنکه سند نیازمندی خوانده شود، شیء و وضعیتش و کنش اصلی در پنج ثانیه روشن است.
• مقایسه در یک جا رخ می‌دهد؛ هیچ‌چیز لازم نیست میان زبانه‌ها یا صفحه‌ها به خاطر سپرده شود.
• هر واقعیت یک جای مرجع دارد و باقی جاها به آن پیوند می‌دهند.
• تراکم با تکرار استفاده می‌خواند و بیش از دو سطح مجاور دیده نمی‌شود.
• متن بلند، عدد بزرگ و نمای باریک ترتیب اطلاعات را نمی‌شکنند.
• هر بلوک و فیلد و برچسب و دکمه‌ای که به داوری کمک نمی‌کند حذف شده است.