حرکت - جنبش

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

راهنمایی در یک نگاه (TL;DR):

اصول حرکت

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

امن

رانندگی وظیفه اصلی کاربر است - هر چیز دیگری در درجه دوم اهمیت قرار دارد. توجه کاربر را به عنوان یک منبع محدود در نظر بگیرید و از ایجاد حواس‌پرتی‌های غیرضروری با حرکت خودداری کنید.

آموزنده

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

انعطاف‌پذیر

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

الگوهای حرکتی

برای پشتیبانی از یک تجربه کاربری ثابت در تمام برنامه‌ها، Android Automotive توصیه‌هایی برای الگوهای حرکتی خاص جهت استفاده در موقعیت‌های زیر ارائه می‌دهد:

• جابجایی بین نماهای هم سطح
• انتقال به نمای جزئیات
• گسترش یک اقدام موجود
• کوچک کردن و بزرگ کردن یک عمل
• اخلال در یک اقدام

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

جابجایی بین نماهای هم سطح

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

مثال

انتقال به نمای جزئیات

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

مثال

گسترش یک اقدام موجود

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

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

مدت زمان

دستورالعمل‌های طراحی متریال در مورد مدت زمان لازم برای انتقال‌ها