۱۰ ابزار برای استفاده از پروژه وب بعدی شما

 

آنچه در زیر می باشد گروهی از ابزارهایی است که شما به عنوان یک توسعه دهنده یا طراح می توانید در پروژه بعدی خود امتحان کنید. این لیست به هیچ وجه دقیق نیست و یا “top ten” از هر چیزی، بلکه به سادگی پیشنهادات به کسانی که به دنبال چیزی جدید است. امیدوارم از ابزارهای ذکر شده لذت ببرید. بیا شروع کنیم!

بازرسی برنامه ای است که کاملا بین فایل های طراحی و ابزار شما همگام سازی می شود. این به شما کمک می کند تا به راحتی فایل های طراحی را بین Sketch، Inspect و InVision حفظ کنید و تنها با یک کلیک همگام سازی کنید.

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

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

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

برای شروع، به Sketch نیاز دارید. هنگامی که شما Sketch نصب کرده اید، به Craft نیاز دارید.

Craft مجموعه ای از پلاگین ها است که به شما اجازه می دهد با اطلاعات واقعی در ذهن طراحی کنید و امکان همگام سازی بین InVision و Sketch را فراهم می کند

 یک پروژه جدید از InVision ایجاد کنید و سپس به Sketch برگردید. من همچنین پیشنهاد می کنم نگاهی به InVision Studio بیاندازید.

Archetype طراحی تایپوگرافی دیجیتال آسان است.

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

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

 ظاهر طراحی شده توسط archetype تولید کد سازنده برای راحتی handoff.

تغییرات و به روز رسانی سریعا و به راحتی قابل اشتراک گذاری با اجازه دادن به کاربران برای صادرات به CSS و یا به طرح.

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

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

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

Probot مجموعه ای از برنامه های مبتنی بر جامعه است که برای اتوماسیون و بهبود گردش کار شما با GitHub است.

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

شما می توانید تمام برنامه های منبع باز را کشف کنید یا خودتان را بسازید.

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

تمرکز بر آنچه میخواهید بسازید.

یک API ساده (ساخته شده بر روی آخرین ویژگی های جاوا اسکریپت ES6) پنهان جزئیات شما را در مورد استفاده از GitHub و Node.js مهم نیست.

آیا تا به حال PSD دریافت کرده اید و آرزو می توانید آن را به یک فایل Sketch تبدیل کنید؟

خب تو شانس هستی Avocode (یکی دیگر از ابزارهای intersting برای آزمایش نیز) به اندازه ای مناسب است که جامعه را به یک ابزار رایگان برای انجام چنین کاری اختصاص دهد.

مرور به URL و آپلود PSD خود را. در اینجا یک نقشه راه و لیستی از ویژگی های فرآیند تبدیل پشتیبانی می کند.

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

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

این می تواند تنها تبدیل عناصر طراحی که می تواند در هر دو این برنامه های طراحی ایجاد شود؛ طرح و فتوشاپ.

این می تواند ویژگی های فتوشاپ را که در برنامه Sketch گنجانده نشده است، شبیه سازی کند.

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

تست سرعت وب سایت یک ابزار تجزیه و تحلیل تصویر است که می تواند هر سایت با یک URL زنده را اسکن کند.

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

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

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

تست سرعت وب سایت یک ابزار تجزیه و تحلیل تصویر است که می تواند هر سایت با یک URL زنده را اسکن کند.

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

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

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

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

Animista به شما انواع گزینه های پیش ساخته شده و سفارشی می دهد تا لحظات حرکت خود را از جمله گزینه های ۳D همراه با تغییرات معمول ۲D خود تنظیم کنید.

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

الگوهای قهرمان مجموعه ای از الگوهای پس زمینه تکرار SVG برای شما برای استفاده در پروژه های وب خود است.

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

در حالی که تصمیمات طراحی خود را تنظیم می کنید، ویژگی های فردی مانند رنگ پیش زمینه، رنگ پس زمینه و شفافیت پیش زمینه را تنظیم کنید.

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

در حال حاضر این برنامه به شما اجازه می دهد بین ۸۷ الگوهای مختلف را انتخاب کنید و کاملا متفاوت با توجه به مقدار کمی از الگوهای ارائه شده است.

کوسن برای صاحبان مشاغل خود کار می کند. این کمک می کند تا به ارائه بینش بهتر و “آرامش را به سوار rollercoaster هر روز است که آزاد است.”

این یک محاکمه ۱۴ روزه (بدون کارت اعتباری مورد نیاز) را ارائه می دهد، و اگر شما در طول محاکمه خود قلاب کرده اید، برنامه ها از ۵ دلار در ماه شروع می شوند؛ همچنین به عنوان طرح “moonlighter” شناخته می شود.

این برنامه کمک می کند تا زمانی که شما نیاز به پوشش پایگاه های خود دارید:

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

برنامه ریزی پروژه
ردیابی هزینه
صفحه گسترده صادرات
صورتحساب
پیگیری فاکتور
نمایش درآمد ماهانه
و بیشتر…
Cushion در حال بررسی یک برنامه تلفن همراه برای آینده است، اما در این زمان یک پیشنهاد ارائه نمی دهد، زیرا تمرکز روی ایجاد یک برنامه وب کامل است.

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

Launchy یک پنجره منحصر به فرد است. این نیز رایگان جی کوئری و تنها ۲۷٫۷ کیلو بایت است

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

چند ویژگی قابل توجه در مورد این ابزار عبارتند از:

در هنگام راه اندازی، فوکوس صفحه کلید به ظرف پنجره مدال منتقل می شود
پنجره مدال از طریق مودال اختیاری توصیف می شود
ترافیک صفحه کلید در هنگام فعال بودن / قابل مشاهده است
پنجره را فشار دهید روی کلید esc بستگی دارد
پنجره بر روی کلیک ماوس روی هم می بندد
تمرکز صفحه کلید را به عنصر پرتاب در پنجره نزدیک متصل می کند
کنترل های سفارشی خود را اضافه کنید!
کنترل های سفارشی خود را اضافه کنید که تمرکز را به جایی دیگر بر روی صفحه اضافه می کنند!
مرز شفاف برای تم های کنتراست بالا ویندوز
Launchy همچنین دارای بسیاری از کلاسهای CSS در عناصر تولید شده خود برای ظاهر سفارشی در دسترس است.

فایل file style.scss را برای نام کلاس ها بررسی کنید و مثال هایی از نحوه ایجاد پنجره های modal خود را داشته باشید.

این پروژه همچنین به عنوان یک بسته npm در دسترس است: npm I-run-modal-window. واقعا یک پنجره مجازی قابل دسترسی درست شده است.

Formcore یک پروژه منبع باز است (که به عنوان “فرم سبک و معتبر” نامیده می شود) توسط گروه Filament و مجموعه ای از الگوهای فرم مانند رمز عبور نشان می دهد / پنهان، شمارنده شخصیت، ورود کارت اعتباری و اعتبار، چند خط متن ورودی که به عنوان نوع کاربر گسترش می یابد و همچنین خیلی بیشتر است.

10 ابزار برای استفاده از پروژه وب بعدی شما

10 ابزار برای استفاده از پروژه وب بعدی شما

ترجمه:۱۰ ابزار برای استفاده از پروژه وب بعدی شما

طراحی سایت در تبریزطراحی سایت شرکتی در تبریزطراحی ساایت فروشگاهی در تبریزشرکت طراحی سایت در تبریزسایت شرکتی در تبریزسایت فروشگاهی در تبریز

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

این فیلد را پر کنید
این فیلد را پر کنید
لطفاً یک نشانی ایمیل معتبر بنویسید.

فهرست