رفتن به مطلب
جامعه‌ی برنامه‌نویسان مُدرن ایران

جستجو در تالارهای گفتگو

در حال نمایش نتایج برای برچسب های 'design tool'.



تنظیمات بیشتر جستجو

  • جستجو بر اساس برچسب

    برچسب ها را با , از یکدیگر جدا نمایید.
  • جستجو بر اساس نویسنده

نوع محتوا


وبلاگ‌ها

چیزی برای نمایش وجود ندارد

چیزی برای نمایش وجود ندارد

تالارهای گفتگو

  • انجمن‌های آی او استریم
    • اخبار و اعلامیه‌های سایت
    • اسناد و قوانین مرجع
    • رویداد‌ها و جلسات
    • معرفی محصولات نوشته شده‌ بومی
    • مرکز نظرسنجی جامعه‌ی برنامه‌نویسان
    • مقالات و اسناد مشاوره‌ای
    • مرکز چالش برانگیز برنامه‌نویسان
    • رمز‌های موفقیت
    • ابزار‌ها و نرم‌افزارهای کاربردی برنامه‌نویسان حرفه‌ای
  • استارتاپی و کسب‌و‌کار
    • استارتاپ‌ها
    • سرمایه گذاری
    • شتاب دهنده‌ها
    • پارک‌های علم و فناوری و مراکز رشد
    • مصاحبه با استارت‌آپ‌ها
    • قوانین حقوقی
    • داستان‌های موفقیت
    • کارآفرینان و متخصصین
    • مشاوره اجرای کسب‌وکار
    • اخبار حوزه‌ی استارتا‌پی
    • آگهی‌های استخدامی
  • زبان‌های برنامه نویسی
    • برنامه نویسی در C و ‏++C
    • برنامه نویسی با Java
    • برنامه نویسی با JavaScript
    • برنامه نویسی با Go
    • برنامه نویسی با Python
    • برنامه نویسی با Delphi
    • برنامه نویسی با Ruby
    • برنامه نویسی با VB6
  • طراحی و توسعه وب
    • برنامه نویسی در PHP
    • برنامه نویسی با Node.JS
  • طراحی و توسعه وب اپلیکیشن‌ها
    • طراحی و توسعه در Angular
    • طراحی و توسعه در React.JS
    • طراحی و توسعه در Vue.JS
  • طراحی و توسعه موبایل و اِمبِد‌ها و تلوزیون‌ها
    • برنامه نویسی تحت محصولات اپل
    • برنامه نویسی تحت محصولات گوگل
    • طراحی و توسعه تحت محصولات دیگر
  • برنامه‌نویسی سطح پایین و سیستم عامل‌ها
    • سیستم عامل‌های آزاد
    • سیستم عامل‌های تجاری
  • بانک‌های اطلاعاتی
    • پایگاه داده MySQL
    • پایگاه داده PostgreSQL
    • پایگاه داده SQLite
    • پایگاه داده MongoDB
    • پایگاه داده SQL Server
    • دیگر پایگاه‌های داده
  • برنامه نویسی تحت محصولات اپل
    • محیط توسعه Xcode
    • برنامه نویسی با Objective-C
    • برنامه نویسی با Swift
  • برنامه نویسی تحت محصولات مایکروسافت
    • محیط توسعه Visual Studio
    • برنامه نویسی در ASP.NET MVC
    • برنامه نویسی با #C
    • برنامه نویسی با Visual Basic.Net
    • طراحی و توسعه تحت Wpf
    • طراحی و توسعه تحت Universal و Fluent
  • طراحی و توسعه تجربه کاربری (UX) و رابط کاربری (UI)
    • طراحی رابط کاربری (UI)
    • طراحی تجربه کاربری (UX)
  • درخواست انجام پروژه (ویژه)
    • پروژه‌های منبع‌باز
  • سوالات و مباحث عامیانه
    • سوالات دانشجویی
    • فناوری و سخت افزار
    • سوالات مشاوره‌ای و تخصصی مرتبط با حوزه‌ی برنامه‌نویسی
  • سطل آشغال
    • سطل آشغال

Product Groups

  • کتاب‌ها و مقالات آموزشی

دسته ها

  • علمی
  • استارتاپی
  • برنامه‌نویسی
    • زبان‌های برنامه نویسی
    • معماری‌ها
  • کامپایلر و مفسر
  • محیط‌های توسعه
  • پلتفرم‌های توسعه
  • کدنویسی ایمن
  • فناوری‌ها
    • پردازش تصویر
    • اینترنت اشیاء
    • پردازش ابری (Cloud Computing)
    • چند سکویی (Cross-Platform)
    • بیگ دیتا (Big Data)
    • هوش مصنوعی (AI)
    • سخت افزار
    • نرم‌افزار و اپلیکیشن
    • اینترنت و شبکه
    • رمزنگاری
    • امبد‌ها (Embedded)
  • طراحی
    • تجربه کاربری
    • رابط کاربری

دسته ها

  • عمومی
  • گرافیکی
  • شبکه و ارتباطات

دسته ها

  • کامپایلر‌ها
  • محیط‌های توسعه
  • کتابخانه‌ها
  • ماژول‌ها و پلاگین‌ها
  • محصولات بومی
  • کتاب‌ها و مقالات
  • زبان‌ها و ابزار‌ها
  • طراحی و گرافیک

جستجو در ...

نمایش نتایجی که شامل ...


تاریخ ایجاد

  • شروع

    پایان


آخرین بروزرسانی

  • شروع

    پایان


فیلتر بر اساس تعداد ...

تاریخ عضویت

  • شروع

    پایان


گروه


شناسه گیت‌هاب


شناسه لینکدین


شهر

1 نتیجه پیدا شد

  1. زمان همیشه به عنوان یک فاکتور اساسی و حساس در پروژه‌ها به حساب می‌آید. در این مقاله قصد داریم ببینیم که چگونه می‌توانیم 90 درصد از وقت خود را طی جریان پروژه صرفه جویی کنیم. یکی از ابزارهایی که برای این منظور وجود دارد، Figma است. با استفاده از این ابزار در طول فرآیند طراحی UI/UX می‌توانیم چندین ساعت در کارمان صرفه‌جویی داشته باشیم و جریان طراحی را عمیقا متحول کنیم. Figma علاوه بر بصری بودن، یک پکیج کامل است که قابلیت کار بر روی تمامی مراحل فرآیند طراحی را برای ما فراهم می‌سازد: رسم وایرفریم‌ها، طراحی، طراحی سیستم‌ها، نمونه‌سازی و طراحی مشارکتی. هدف از این مقاله آموزش نحوه‌ی استفاده از Figma نیست؛ بلکه می‌خواهیم به شما نشان دهیم که چگونه می‌توانید چندین ساعت زمان را در پروژه‌ی بعدی خود با یک ترفند ساده ذخیره کنید. این امر به خاطر وجود ویژگی‌ای از Figma به نام اجزا یا مولفه‌ها (Components) تحقق می پذیرد. components in Figma اجزا در Figma شباهت زیادی به نمادها (Symbols) در Sketch دارد. اما اجزای موجود در ابزار Figma بسیار انعطاف پذیر و استفاده از آن‌ها آسان‌تر است. اگر در مورد اجزا اطلاعات زیادی ندارید، توصیه می‌کنم این مقاله را با دقت مطالعه کنید. Figma‌ چگونه به ما در صرفه‌جویی زمان کمک می‌کند؟ حال ببینیم فرآیند طراحی سنتی در مقایسه با فرآیند طراحی در Figma چگونه به نظر می‌رسد. فرآیند فرآیند سنتی یا کلاسیک ساده‌ترین فرآیند کلاسیک، ساخت یک وایرفریم در برنامه‌ای مانند Balsamiq است. سپس می‌توان طرح را در یک برنامه‌ی دیگری مانند Sketch ساخت و در برنامه‌ای چون InVision نمونه‌‌ی اولیه را ایجاد کرد. این روند یک روند تعاملی نیست، زیرا علاوه‌ بر اتلاف وقت زیاد، باعث به وجود آمدن شکاف بزرگی بین وایرفریم و نمونه‌سازی می‌شود. فرآیند طراحی در Figma با استفاده از Figma، شما از 2 مرحله پرش کرده، وایرفریم‌های تعاملی خود را رسم و هم زمان یک کتابخانه‌ی رابط کاربری ایجاد می‌کنید. سپس اجزا رIبط کاربری را به‌روز می‌کنید که قبلا وقت ارزشمندتان را برای ایجاد یک نمونه اولیه هدر می‌کردید! در واقع شما وایرفریم‌های خود را با استفاده از اجزا از ابتدا می‌سازید. پس از تایید وایرفریم‌ها، تنها چیزی که نیاز دارید به‌روز کردن اجزا است. این کار اشکال سفید و سیاه پایه‌ای شما را به اجزای طراحی شده‌ی دقیق تبدیل می‌کند. به بیان دیگر وایرفریم‌های شما به یک نمونه‌ی اولیه با وضوح و جزییات بیشتر تبدیل می‌شوند. چگونه کار می‌کند؟ این کار در ۴ مرحله انجام می‌شود که در زیر آورده شده است. مرحله‌ی۱. وایرفریم‌های خود را بسازید. قبل از این مرحله، شما باید طرح خود را روی کاغذ کشیده باشید. حال زمان آن فرا رسیده که آن‌ها را ب‌‌‌ م‌های دیجیتال منتقل کنید. پیش از شروع طراحی، اولین کاری که باید انجام دهید ایجاد یک قالب کتابخانه‌ی رابط کاربری (UI library frame) است. تمام اجزای رابط کاربری قابل استفاده‌ی مجدد و دستورالعمل های شما در این قالب قرار می‌گیرند. اولین مولفه‌هایی (Components) که باید ایجاد کنید سبکهای متن شماست. برای هر سبک (H1، H2، H3، H4، P، کوچک، و غیره) یک جز ایجاد کنید. از فونت‌ها همان گونه که هستند استفاده کنید و فعلا در مورد طراحی فکر نکنید. هر سبک متن یک جز است حال، هر زمان که می‌خواهید متنی را به صفحه اضافه کنید، یک نمونه از مولفه‌ی متن در کتابخانه‌ی رابط کاربری را می‌گیرید. چرا؟ هنگامی که شما به مرحله‌ی طراحی ‌‌‌‌‌می‌روید و می‌خواهید سبک فونت را برای تمامی صفحه‌های خود تغییر دهید، آن را یک بار از همین جا تغییر می‌دهید و در همه جا به‌روز می‌شود. کمی بعد کاملا متوجه خواهید شد. این مفهوم به تمامی مولفه‌های دیگر شما قابل تعمیم است. یک نمونه کتابخانه‌ی رابط کاربری تمامی اشیا (Objects) از جمله Buttons، Inputs، Dropdowns، Navbars، Cards، Labels، Footers را هم دقیقا مانند اجزا ایجاد کنید. همچنین می‌توانید ابتدا شی را روی صفحه‌ی نمایش ایجاد کنید سپس آن را به کتابخانه‌ی خود بکشید و به یک جز تبدیل کنید و سپس دوباره در صفحه کپی کنید. نمونه‌ای از وایرفریم‌ها در پایان پروژه، تقریبا هر شی‌ای که در طرح‌ها‌ ایجاد می‌کنید، باید یک جز باشد. این کار نه تنها در صرفه‌جویی زمان به شما کمک می‌کند، بلکه هماهنگی را در محصول شما حفظ می‌کند که یک نکته‌ی کلیدی مهم در طراحی رابط کاربری و تجربه‌ی کاربری است. مرحله‌ی۲. وایرفریم‌های خود را تعاملی کنید. پس از رسم وایرفریم‌ها و ایجاد کتابخانه، زمان تعاملی کردن وایرفریم‌ها رسیده است. خوشبختانه، وجود Figma انجام این کار را بسیار ساده کرده است. تمام چیزی که نیاز دارید کشیدن هر شی به صفحه مرتبط با خود در حالت نمونه‌ی اولیه است. همان طور که در زیر می‌بینید، اتصال مولفه‌های اصلی همان لینک را به تمام نمونه های آن اعمال می‌کند. تعاملی ساختن وایرفریم‌ها گام بعدی این است که وایرفریم‌های تعاملی خود را با ذینفعان به اشتراک بگذارید و نظرات خود را با اضافه کردن در نمونه‌ی اولیه به طور مستقیم دریافت کنید. پس از چندین دوره‌ی تکرار، وایرفریم‌های شما باید تایید شوند. مرحله‌ی 3. سبک سیستم طراحی خود مشخص کنید. هنگامی که وایرفریم‌های تعاملی شما تایید شدند، اکنون می‌توانید سبک سیستم طراحی خود را تعیین کنید. در این مرحله، شما دستورالعمل طراحی برند، رنگ و جزییات طراحی را به اجزای ساخته شده در کتابخانه اضافه می‌کنید. این مرحله به طور کامل وایرفریم‌های شما را به یک نمونه‌ی اولیه‌ی طراحی با وضوح و جزییات بالا تبدیل می‌کند. تغییر سبک در یک جز در همه‌ی نمونه های آن اعمال میشود بهتر است ابتدا راهنمای سبک را به ذینفعان نشان دهیم تا بازخوردی در مورد حالت و سبک طراحی قبل از نمایش همه‌ی صفحات به دست آوریم. اضافه کردن تعدادی مولفه در حضور آن‌ها می‌تواند به درکشان از چگونگی طراحی هر مولفه کمک کند. یک کتابخانه‌ی رابط کاربری پایه‌ای مرحله‌ی 4. نمونه‌ی اولیه‌ی خود را نهایی کنید. هنگامی که راهنمای سبک تایید شد، تنها چیزی که باقی می‌ماند، بهتر کردن نمونه‌ی اولیه است. در این مرحله می‌توانید مطمئن شوید که همه چیز در جای خود قرار دارد. ممکن است اشیایی وجود داشته باشند که اجزایی نیستند که باید طراحی شوند یا اجزا مورد نیاز باشند. حتما نمونه‌ی اولیه را اجرا کرده و لینک‌ها را امتحان کنید تا مطمئن شوید که تمامی پیوندها به درستی کار می‌کنند. نمونه‌ی اولیه نمونه‌ی اولیه آماده است! اکنون می‌توانید یک لینک را با سهام‌دار برای گرفتن تایید نهایی به اشتراک بگذارید. سپس، این نمونه‌ی اولیه را به توسعه‌دهندگان ارسال کنید و به آن‌ها نشان دهید که چگونه می‌توانند تصاویر را در Figma بررسی و استخراج کنند. همچنین توسعه‌دهندگان می‌توانند هر گونه سوال مستقیمی که از نمونه‌ی اولیه دارند بپرسند. اضافه کردن نظر در نمونه‌‌ی اولیه شما همچنین می‌توانید یک لینک عمومی برای تست نمونه‌ی اولیه‌ی خود با دیگر کاربران به اشتراک بگذارید و یک بازخورد کلی به دست آورید. امیدوارم به کمک این ابزار بتوانید با سرعت بیشتری فرآیند طراحی را خود را پیش ببرید.
×