اصول طراحي اپليكيشن موبايل

در اين مقاله قصد داريم برخي اصول درست در طراحي اپليكيشن موبايل را خدمتتان ارائه نماييم، البته ما نمي خواهيم به شما دستورالعملي بدهيم يا بگوييم چگونه طراحي كنيد اما اين جا يك نقطه شروع خوب براي دستيابي به يك طرح مناسب خواهد بود.

اصول كلي

احترام به پلتفرم

ما الگو ها و اجزاي سيستم عامل هاي اندرويد و IOS را كه برنامه هاي ما در آن ها وجود دارند را مستند كرديم. هنگام طراحي اين مدل اپليكيشن ها ابتدا لازم است كه به راهنمايي ها و دستورالعمل هاي سيستم عامل ها مراجعه نماييد تا بتوانيد طرحي با كيفيت را پياده سازي نماييد. به خاطر داشته باشيد كه دستورالعمل هاي اين سيستم عامل ها به صورت مداوم در حال تكامل بوده و سعي كنيد هر از چند گاهي با مطالعه دستورالعمل هاي تازه اطلاعات هود را به روز رساني كنيد.

دستورالعمل رابط كاربري اپل: https://developer.apple.com/ios/human-interface-guidelines

دستورالعمل متريال ديزاين گوگل: https://material.io/guidelines

سود بردن مشتريان

هميشه اولين عامل طراحي خود را سود.و مزيت مشتريان قرار دهيد. از ابزار هاي مشابه استفاده نكنيد، هر چند در برخي از موارد استثنا هايي براي استفاده از آن ها وجود دارد. در بعضي موارد نياز به طراحي جديد نيست و شما مي توانيد از الگو و ابزار هايي كه قبلا استفاده كرديد براي ويژگي هاي ديگر نيز مجددا استفاده نماييد. الگو هاي طراحي مانند يك سيستم ما را راهنمايي مي كنند. هميشه از خودتان اين سوال را بپرسيد: " اين طرح چه سودي براي مشتريان دارد؟ "

درباره دستگاه فكر كنيد

ابتدا درباره قابليت هاي دستگاه مد نظر خود فكر كنيد (قابليت هايي مانند لمس كردن، صدا، فشردن، شتاب سنج، مكان ياب و غيره). طراحي شما حول دستگاه، سيستم عامل و تجربه كاربري خواهد بود. چگونه مي توان از ويژگي هاي اين دستگاه در محصولات خودمان استفاده كرد؟ دستگاه تلفن همراه چه مزيت هايي را فراتر از صفحه نمايش مقابل كاربران براي آن ها خواهد داشت؟

مقياس پذيري را در ذهن داشته باشيد

به خاطر داشته باشيد كه يك دستگاه تلفن همراه فقط يك گوشي نيست. مقياس پذيري در بين دستگاه ها، مخصوصا موبايل ها و تبلت ها هميشه يك چالش مهم براي طراحان بوده است. برخي از سوالاتي كه ممكن است ايجاد شوند را در اين جا آورده ايم:

آيا طراحان وب و طراحان تبلت ها با هم برابر هستند؟ آيا مي توان از الگو هاي طراحي موبايل در تبلت ها نيز استفاده نمود؟ 

براي پاسخ به اين سوالات مي توان گفت: تحقيقات نشان داده اند كه با اين كه تبلت ها و تلفن هاي همراه شباهت هاي زيادي با هم دارند اما كاربران بسيار متفاوت از آن ها استفاده مي كنند.

الگوها و دستورالعمل ها 

انتقال بين صفحات 

يكي از مهم ترين جنبه هايي كه سبب هدايت محتوا در دستگاه هاي موبايل مي شود، انتقال بين صفحات است. دو سوال اين جا ايجاد مي شود:

چه زماني بايد صفحه نمايش از سمت راست به چپ (push) حركت كند؟ چه زماني بايد صفحه نمايش از پايين به بالا (modal) حركت كند؟ 

ما استفاده از روش هاي زير را توصيه مي كنيم:

حركت صفحه نمايش از سمت راست به چپ (push) معمولا براي نمايش صفحات جديدي است كه در بالاي صفحه قبلي قرار دارد. معمولا يك دكمه برگشت وجود دارد كه كاربر مي تواند با استفاده از آن آخرين صفحه اي را كه مشاهده كرده، ببيند. براي صفحاتي مانند جزئيات تراكنش ها، يا ليست ها از اين روش استفاده مي كنيم. 

حركت صفحه نمايش از پايين به بالا (modal) معمولا براي انتخاب، ويرايش محتوا يا داده هاي ورودي مورد استفاده قرار مي گيرد. تمامي فرم هاي تراكنش ها از (modal) استفاده مي كنند. اين صفحات اغلب داراي عناويني مانند لغو، انجام يا ذخيره هستند. بنابر اين هنگامي كه شما " ذخيره"  را لمس كنيد، يك صفحه نمايش به صورت (push) نمايش داده مي شود، زيرا شما محتواي ذخيره شده را مشاهده مي كنيد و در حال ويرايش آن نيستيد. 

تماس با اكشن ها

در اين جا سوال مهمي وجود دارد: براي تماس با اكشن ها از دكمه ها استفاده كنيم يا لينك متني؟ 

در هر دو دستورالعمل طراحي iOS و اندرويد، استفاده از متن به جاي دكمه ها توصيه شده است. در هر صورت من فكر مي كنم هنگامي كه ما از متني استفاده مي كنيم كه داراي يك فونت خاصي است و يك بك گراند روشن يا تيره دارد، ما از يك فرصت بزرگ براي تركيب عناصر برند مانند رنگ سبز اكوسيستم يا خطوط هنري استفاده مي كنيم.

صفحات خالي

صفحه نمايش خالي اولين چيزي است كه كاربراني كه تازه برنامه ما را نصب كرده اند با آن مواجه خواهند شد. اين صفحه معمولا شامل يك تصوير، يك توضيح مختصر و لينك تماس با اكشن ها است. يك روش رايج، استفاده از متن خاكستري در يك پس زمينه روشن است. قبل از استفاده، با استفاده از تجزيه و تحليل رنگ هاي پيش زمينه و پس زمينه مطمئن شويد كه متن در دسترس و قابل خواندن است. 

اكشن شيت ها

طبق قائده كلي طراحي صفحات موبايل: هر وقت كه اكشن هاي متعددي در دست اقدام بود، مي توان از اكشن شيت ها استفاده نمود.

كارت ها يا Tiles

يك كارت ابزاري است كه به صورت يك محتوا مستطيلي براي نمايش مقادير مشخصي از اطلاعات عمل مي كند. بر اساس ظاهر و استفاده دو نوع كارت وجود دارد: اشكن كارت و اينفو كارت.

ديالوگ ها

ما از پنجره هاي ديالوگ براي هشدار هاي بحراني، هشدارهاي مربوط به مجوزها، هشدارهاي مسدود كننده سيستم، و غيره استفاده مي كنيم. كلمه كليدي "هشدار" است. توجه داشته باشيد كه براي اقداماتي كه به اين موارد مربوط نيست، ما سعي مي كنيم از اكشن شيت ها استفاده كنيم.

فونت ها

قانون كلي براي ديزاين هاي تلفن هاي همراه استفاده از فونت هاي سيستمي است. اما گاهي ما نياز داريم كه برند و نام تجاري خود را استفاده نماييم. ما براي هدر ها از فونت هاي خودمان استفاده مي كنيم اما براي متن هاي معمولي و متن هاي درون دكمه ها از فونت هاي سيستمي استفاده مي نماييم. 

توگل ها

توگل سوئيچ ها براي هدايت عمليات هاي باينري (به عنوان مثال چرخش چيزي در حالت خاموش و روشن) مورد استفاده قرار مي گيرند. با استفاده از آن ها كاربر مي تواند يك پروسه را فعال يا غير فعال كند.

در پايان بايد گفت كه اين موارد فقط چند نكته براي شروع كار و سرعت بخشيدن به روند طراحي اپليكيشن هاي موبايل بود. شما مي توانيد با استفاده از غرايز خود طرح هاي زيبايي را پياده سازي كنيد، اما به خاطر داشته باشيد كه به سيستم ها احترام بگذاريد، به منافع مشتريان خود فكر كنيد و اول به دستگاه و مقياس پذيري آن فكر كنيد.

شركت نوپرداز با آخرين و بروزترين فناوري ها آماده ارائه بهترين خدمات در زمينه طراحي اپليكيشن، طراحي سايت، طراحي فروشگاه اينترنتي به مشتريان خود ميباشد.