10 нових інструментів веб-дизайну на квітень 2018 року

Автор: Monica Porter
Дата Створення: 17 Березень 2021
Дата Оновлення: 17 Травень 2024
Anonim
Процессы Производства, от Которых Волосы Встают Дыбом! Топ 10
Відеоролик: Процессы Производства, от Которых Волосы Встают Дыбом! Топ 10

Зміст

Темою нашого огляду цього місяця є швидкість та ефективність: деякі з них інструменти веб-дизайну зробить дивовижні речі для вашого робочого процесу, вирізавши нудні, неприємні завдання, які не мають нічого спільного з дизайном. Візьміть Stackswell - він автоматизує всі надокучливі шматочки виконання адаптивного дизайну в Sketch. Інший наш інструмент пришвидшує роботу, витягуючи та упорядковуючи всі ресурси з файлу .sketch.

Окрім цього, є новий класний платіжний продукт від Stripe, чудовий мережевий інструмент для креативів Тіни Рот Айзенберг та фантастичний інструмент для вимірювання речей на екрані в пікселях.

01. Дизайн системних репо

Якщо вам було доручено попрацювати над деякими інгредієнтами для системи дизайну вашої організації або, можливо, навіть побудувати чи кодифікувати саму систему, ви хочете швидше ознайомитись із останніми ресурсами з цієї теми.


Для цього Design Systems Repo - ваш друг. Це колекція книг, статей, бесід, веб-сайтів, інструментів, систем дизайну, бібліотек шаблонів та довідників стилів, за допомогою яких ви можете зрозуміти, як це роблять провідні організації та провідні мислителі.

02. PixelSnap

PixelSnap - це дуже вишуканий додаток, який робить вимірювання речей на екрані набагато меншим, а тим менше дратує. Помістіть курсор між двома елементами, такими як зображення та заголовок, і він автоматично повідомляє вам кількість пікселів між ними. Намалюйте прямокутник навколо елемента, і він зафіксується навколо нього і повідомить вам його розміри. Так. Ви можете виміряти речі так швидко.

Перегляньте відео на домашній сторінці, щоб отримати ідею. Додаток коштує $ 15, і єдиним недоліком є ​​те, що наразі він доступний лише як додаток для Mac. Але якщо ви користувач Mac, це чудово.


03. Ескіз. Ріпак

Експорт та підготовка активів із Sketch для передачі іншій команді може бути справжнім захопленням, тому перспектива інструменту, який робить це за вас одним клацанням миші, досить захоплююча. Sketch.The.Ripper витягує та упорядковує екрани, копіює та раструє зображення з усіх монтажних областей у файлі .sketch та представляє їх зручним чином. Ви можете побачити приклад виводу з розірваного файлу тут.

Цей інструмент заснований на Інтернеті, тому він працює на будь-якій ОС, що може усунути деяке тертя з робочого процесу, якщо люди використовують різні системи. Це зроблено Icons8, і ви можете прочитати більше про це тут.

04. Стексвелл

Stackswell пришвидшує ваш адаптивний робочий процес, додаючи медіа-запити до Sketch та автоматизуючи процес оновлення стилів типу та символів для кожної точки зупинки. Замість того, щоб виконувати цю роботу вручну, при регулюванні ширини монтажної області стилі автоматично оновлюються.


Stackswell також позбавляє вас від роботи з перевірки вашого вертикального інтервалу для кожної точки розриву, завдяки чому ви отримуєте послідовний інтервал з мінімальними клопотами. Детальніше про це ви можете прочитати в цій статті.

05. Змінні шрифти

Змінні шрифти дозволяють використовувати багато різних ваг та ширини шрифтів без необхідності включати окремий файл для кожного: ви включаєте один файл, а потім модифікуєте шрифт за допомогою CSS. Це чудова ситуація, оскільки вона дозволяє використовувати типографіку якнайкраще у своїх дизайнах, не збільшуючи вагу сторінки.

Не всі змінні шрифти однакові; одні гнучкіші за інші. Цей інструмент дозволяє знаходити різні шрифти та експериментувати з ними, щоб перевірити, чи відповідають вони вашим потребам. Щоб отримати додаткову інформацію про змінні шрифти та отримати уявлення про те, чого можна досягти, спробуйте цю демонстрацію.

06. Смугастий білінг

Новий платіжний продукт Stripe для бізнесу в Інтернеті пропонує третій шлях для компаній, які розглядають дилему щодо створення чи придбання системи виставлення рахунків (докладніше про це див. Нашу статтю про рішення інтернет-магазину). API Stripe Billing легко інтегрується в існуючий веб-сайт і дозволяє використовувати будівельні блоки для створення гнучкої системи з урахуванням ваших потреб.

Коли ваша система налаштована, всім можна керувати з інформаційної панелі, де ви можете зберігати підписки, рахунки-фактури та фінансові звіти. Ви також отримуєте потужні функції, такі як глобальна платіжна система Stripe, яка обробляє різні валюти та кредитні картки, та гнучкі компоненти виставлення рахунків, які дозволяють експериментувати з ціноутворенням.

07. CreativeGuild

CreativeGuild - це виділення CreativeMornings, щомісячної серії лекцій, заснованої Тіною Рот Айзенберг у Брукліні десять років тому. Концепція стала хітом, і зараз у понад 185 містах по всьому світу є розділи CreativeMornings, кожен із яких має свою яскраву спільноту, яка плекає та надихає своїх членів.

CreativeGuild має на меті передати деякі аспекти спільноти в Інтернеті, щоб вони були доступні для більшої кількості людей. Ви можете вважати це схожим на LinkedIn, але для креативів. Є каталог креативних компаній, приватних осіб та робочих місць, і ви можете шукати за місцем знаходження, щоб знайти можливості у своєму місті.

08. Мобін

Mobbin - це галерея дизайнів мобільних додатків, за допомогою яких ви можете отримати ідеї для власних проектів - замість того, щоб встановлювати безліч програм, ви можете переглядати їх в одному місці, щоб побачити, як інші вирішують проблеми дизайну. Відображається шість екранів для кожного додатка, щоб ви могли скласти уявлення про подорож користувача та шаблон дизайну для кожного з них. Також на бічній панелі відображаються списки вакансій.

09. HueSnap

Ви ніколи не знаєте, коли натхнення вразить; можливо, декор готелю або світло в парку буде схоже на правильну колірну гамму для вашої роботи. Якщо це трапиться, ви можете зробити знімок і скористатися HueSnap, щоб виділити кольори із зображення та зробити їх у палітру.

Додаток націлений на мобільне використання, тому найкраще працює на вашому телефоні, і ви можете зберігати та ділитися своїми палітрами з іншими. Існують різні функції, які допоможуть вам змінити палітру, наприклад, варіанти вибору додаткових та складених кольорів. Ваша палітра може мати до шести кольорів у кожному.

Щоб дізнатись більше, погляньте на наш огляд найкращих кольорових інструментів для веб-дизайнерів.

10. Еградієнти

Той, хто зібрав цю колекцію красивих градієнтів, має чудове око для кольорів та цікаве почуття гумору. Кожен градієнт відображається у контейнері у формі яйця та отримує назву, яка може як-небудь пов’язана з кольорами. Якщо є відношення, ми не змогли його розшифрувати.

Прикладом назв є "Успішний іммігрант" для бірюзового градієнта, "Розбите серце Возняка" для блідо-блакитного та "Милосердний ворог" для переходу від жовтого до зеленого.

Отримайте свій квиток у Генеріт Нью-Йорк

Ведучий захід веб-дизайну Генеруйте Нью-Йорк повернувся. Серед 25-27 квітня серед головних спікерів - Ден Молл SuperFriendly, консультант з веб-анімації Валь Хед, повнофункціональний розробник JavaScript Вес Бос та інші. Також є день семінарів та найкращі можливості для спілкування - не пропустіть. Отримайте свій квиток Generate зараз.

Популярні Повідомлення
10 порад щодо вдосконалення досвіду для успіху додатків iOS
Читати Далі

10 порад щодо вдосконалення досвіду для успіху додатків iOS

Рекомендації щодо людського інтерфейсу дуже схожі на технічний документ, що може бути дивним, що надходить від Apple, але правила існують, щоб допомогти вам зрозуміти технічні аспекти платформи та, та...
Приготування їжі з Амперсанда
Читати Далі

Приготування їжі з Амперсанда

Амперсанд часто зображували у багатьох творчих формах. Любіть це або ненавидьте, це стало невід’ємною частиною типографіки. Тут фотограф і любитель шрифтів Емілі Блінко поєднала свої пристрасті для ць...
Виходячи за межі веб-дизайну
Читати Далі

Виходячи за межі веб-дизайну

Конкуренція в галузі веб-дизайну жорстока як ніколи, щодня з’являється все більше дизайнерів. Потреба залишатися на крок попереду і пропонувати щось інше представляє значний виклик для галузі.Веб-диза...