کاربرد ده اصل دیتر رام در طراحی وب سایت

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

از جمله آنها می توان به رادیو جیبی T3 – که طراحی Apple iPod مبتنی بر آن بود – و سیستم قفسه بندی جهانی 606.

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

این اصول در حوزه مهندسی صنایع متولد شده‌اند، اما می‌توانند به همان اندازه در طراحی وب اعمال شوند.

 

طراحی خوب نوآورانه است.

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

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

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

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

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

خارج از چارچوب فکر کنید.

 

طراحی خوب یک محصول را مفید می کند

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

Yahoo! صفحه اصلی در حدود 1997

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

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

مطالب را خوانا کنید. اصول تایپوگرافی خوب را یاد بگیرید. حداکثر از 2-4 تایپ فیس استفاده کنید. صفحه خود را در امتداد یک شبکه پایه طراحی کنید.

وبلاگ دیو گاماچه از تایپوگرافی مؤثر برای کمک به کاربران کمک می کند تا بر آنچه که باید تمرکز کنند بگویید.

 

طراحی خوب زیبایی شناسی است

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

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

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

طبیعت همچنین استعداد عجیبی در ساخت طرح‌های رنگی دارد – غروب خورشید، گیاهان، حیوانات و مناظر. این اشیاء در طبیعت (از جمله ویژگی‌های انسانی) که از نسبت طلایی پیروی می‌کنند، چیزهایی هستند که به نظر ما زیبا هستند.

الگوی دانه ها در این آفتابگردان زیبا با نسبت طلایی کنترل می شود. الگوهای A و B در سمت چپ، اگر طبیعت از یک عدد غیرمنطقی متفاوت استفاده می‌کرد، مارپیچ‌های دانه شبیه به آن خواهند بود. الگوی C نسبت طلایی را در کار نشان می دهد.

 

طراحی خوب یک محصول را قابل درک می کند

اگر می‌خواهید بدانید چگونه چیزی را قابل درک کنید، به صفحه قفل آیفون نگاهی بیندازید. آیا تا به حال متوجه درخشش ظریف در امتداد نوار لغزنده ای شده اید که در جهتی حرکت می کند که باید در آن بلغزید؟ ظریف و در عین حال مفید.

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

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

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

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

 

طراحی خوب محجوب است

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

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

آنلاین، متفاوت است. فرآیند پرداخت ساده، ایمن و سریع است. هدف این است که مشتری را وادار کنیم تا آنچه را که می خواهد در سریع ترین زمان ممکن خریداری کند. نیازی به استفاده از دیلی نیست.

تجربه آجر و ملات ویکتوریا سیکرت تاکیدی بر فرآیند پرداخت می کند. عکس از Dwight Burdette.

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

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

 

طراحی خوب صادقانه است

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

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

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

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

نوعی از ضدالگوی “دزدکی در سبد”. به گفته این کاربر، در دومین بازدید از سایت رایان ایر، کرایه همان بلیت تقریبا دو برابر می شود. پاک کردن کوکی‌های مرورگر، قیمت را به مقدار اصلی خود بازمی‌گرداند.

 

طراحی خوب ماندگاری طولانی دارد

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

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

به برخی از وب‌سایت‌هایی که در طول سال‌ها ساختار اولیه خود را حفظ کرده‌اند، نگاهی بیندازید. به طور تصادفی، آنها همچنین جزو تأثیرگذارترین برندهای جهان هستند.

آمازون

 

Google

 

اپل

 

طراحی خوب تا آخرین جزئیات کامل است

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

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

اگر لازم است از چک لیست استفاده کنید.

 

طراحی خوب سازگار با محیط زیست است

بهینه سازی کنید بدون به خطر انداختن تجربه کاربر. با استفاده از نشانه گذاری بهینه، تصاویر بهینه شده تحت وب و جاوا اسکریپت و CSS کوچک شده، پهنای باندی را که برای بارگیری کل صفحه لازم است کاهش دهید. هر چه کاربران زمان کمتری را برای بارگذاری وب سایت شما صرف کنند، زمان بیشتری برای لذت بردن از آن دارند. در عین حال، حتی ممکن است به کاهش انرژی مصرف شده در ارائه خدمات و ارائه وب سایت خود کمک کنید، بنابراین «ردپای کربن» آن را کاهش دهید.

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

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

 

طراحی خوب تا حد امکان کم است

کمتر، بیشتر است. با این حال، برای بسیاری از طراحان، فریب دادن با افزودن جزئیات تزئینی بسیار آسان است.

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

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

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

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

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

 

نتیجه گیری

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