آموزش ساخت آن به عنوان یک طراح: نحوه کار با توسعه دهندگان
Making It as a Designer: How to Work With Developers
در این کلاس، نحوه برقراری ارتباط مؤثرتر با کدگذاران زندگی خود را یاد خواهید گرفت. اگر شما با طراحی صحبت می کنید (نه کد) و آنها با کد صحبت می کنند (نه طراحی)، گاهی اوقات ممکن است رسیدن به محصول نهایی که تصور می کنید بدون ساعت ها ناامیدی و انتظارات از دست رفته غیرممکن به نظر برسد.
اما با چند قانون سرانگشتی و برخی روش‌های جدید تفکر، می‌توانید پروژه طراحی نرم‌افزار بعدی خود را از پارک خارج کنید.
این کلاس را دوست خواهید داشت اگر:
- یک طراح باتجربه که به تازگی اولین کنسرت خود را برای طراحی یک وب سایت یا برنامه ارائه کرده است
- یک طراح رابط که از پس گرفتن کار از برنامه‌نویس شما ناامید شده است و به نظر می‌رسد... بد
- طراحي كه مي خواهد بياموزد كه با توسعه دهندگان ارتباط موثرتر برقرار كند
این کلاس برای طراحان با تجربه، به ویژه آنهایی که در طراحی رابط های نرم افزاری تازه کار هستند، در نظر گرفته شده است. شما روی یک پروژه طراحی وب کار می کنید، بنابراین باید به ابزار طراحی مانند Photoshop، Sketch یا Adobe XD دسترسی داشته باشید.
طراحی سایت را به یک سیستم طراحی تبدیل کنید!
برای پروژه خود، از طراحی وب سایت موجودی که انجام داده اید استفاده کنید و با استفاده از آنچه در اینجا یاد می گیرید، آن را به یک سیستم طراحی تبدیل کنید.
نمیدانید از کجا شروع کنید؟ ما یک چک لیست در بخش منابع داریم تا شما را شروع کنیم.
برخی از منابع یادگیری اضافی در مورد سیستم های طراحی:
- (بیشتر برنامه نویس محور)
- با مثال
- ، سایتی که همه چیز درباره استفاده از سیستم های طراحی، از Figma است
چند نمونه سیستم طراحی:
- تعداد زیادی کیت UI نمونه برای XD وجود دارد
- می‌توانید نمونه کیت UI را که در این کلاس ارائه شده است ("Pawtastic" توسط مگان فیشر) مستقیما دانلود کنید
- ، سیستم طراحی مورد استفاده توسط دولت فدرال ایالات متحده برای طراحی و ساخت سریعتر سایت های فدرال
- (و صفحه ای با دستورالعمل های کلی تر)
- ، سیستم طراحی متن باز و قابل تنظیم Google
- ...و
موارد زیر را در سیستم طراحی خود بگنجانید:
- راهنمای سبک تایپوگرافی
- شامل سطوح سرفصل 1 تا 3
- پاراگراف ها
- فهرست، مرتب و نامرتب
- عناصر فرم
- راهنمای رنگ
- یک شبکه
- حداقل 3 جزء
اگر بتوانید فایل های خود را از طریق منوی اشتراک گذاری Zeplin یا Adobe XD به اشتراک بگذارید، امتیاز جایزه!
درس ها Lessons
-
همه اش را بگذار کنار هم Putting It All Together
-
مقدمه Introduction
-
چه مشکلی با روشی که ما اکنون کارها را انجام می دهیم چیست؟ What's Wrong with the Way We Do Things Now?
-
نکات سیستم طراحی Design System Tips
-
معرفی سیستم های طراحی Introducing Design Systems
-
نتیجه Conclusion
-
توسعه دهندگان را زودتر درگیر کنید Involve Developers Early
-
فرآیند دستیابی به طراحی را بهبود بخشید Improve the Design Handoff Process
-
چگونه می توانم توسعه دهندگان را زودتر درگیر کنم؟ How Do I Get Developers Involved Early?
-
با توسعه دهندگان خود اعتماد ایجاد کنید Build Trust with Your Devs
-
فرآیند طراحی وب سایت معمولی در حال حاضر چگونه است؟ What Does the Typical Web Design Process Look Like Now?
-
اما، اما، اما... But, But, But...
-
نمونه سیستم طراحی Design System Example
https://donyad.com/d/0e8b
Vincent Maglione
طراح/توسعه دهنده
از حضور شما متشکریم!
من وینسنت هستم. من یک طراح و توسعه دهنده هستم که در نزدیکی آتلانتا، GA زندگی و کار می کنم.
به‌عنوان یک طراح جوان، من همیشه شیفته کد بودم، و دوست داشتم چیزهایی را بسازم و بسازم -- اما همیشه مردد بودم که خودم را "توسعه‌دهنده" بنامم.
اما در چند سال گذشته، من به‌عنوان یک برنامه‌نویس تمام وقت کار می‌کردم و کاری را که انجام می‌دهم دوست دارم.
من با تیم‌ها و آژانس‌ها برای طراحی و ساخت وب‌سایت‌ها و برنامه‌های وب برای شرکت‌هایی مانند Samsung، Home Depot، Mitsubishi Electric، Disney، IHG -- و بسیاری از مشاغل محلی کوچک کار کرده‌ام.
من گهگاه در وبلاگ می نویسم، اما شما همچنین می توانید مرا در توییتر پیدا کنید.
اگر طراح هستید که به کدنویسی علاقه مند هستید، به جای درستی آمده اید! کد می تواند ترسناک باشد، اما یک ابزار طراحی بسیار قدرتمند است. (می توانید برای مشاهده نمونه هایی از نحوه استفاده خلاقانه از کد مراجعه کنید! نمونه ای نیز در زیر وجود دارد.)
نمایش نظرات