10 нови инструмента за уеб дизайн за април 2018 г.

Автор: Monica Porter
Дата На Създаване: 17 Март 2021
Дата На Актуализиране: 17 Може 2024
Anonim
Макет за 1 час
Видео: Макет за 1 час

Съдържание

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

На всичкото отгоре има страхотен нов продукт за фактуриране от Stripe, чудесен мрежов инструмент за рекламни послания от Тина Рот Айзенберг и фантастичен инструмент за измерване на нещата на екрана ви в пиксели.

01. Дизайн системи Repo

Ако сте били натоварени да работите върху някои от съставките на системата за проектиране на вашата организация или може би дори да изградите или кодифицирате самата система, ще искате да ускорите с най-новите ресурси по темата.


За това Design Systems Repo е ваш приятел. Това е колекция от книги, статии, беседи, уебсайтове, инструменти, системи за дизайн, библиотеки с модели и ръководства за стил, които можете да използвате, за да разберете как вършат нещата най-добрите организации и водещи мислители.

02. PixelSnap

PixelSnap е много изящно приложение, което прави измерването на нещата на екрана ви много по-малко досадно. Поставете курсора между два елемента, като изображение и заглавие, и той автоматично ви показва броя на пикселите между тях. Начертайте правоъгълник около елемент и той щрака около него и ви казва размерите му. Да. Можете да измервате нещата толкова бързо.

Вижте видеоклипа на началната страница, за да разберете идеята. Приложението е на цена $ 15 и единственият недостатък е, че засега е достъпно само като приложение за Mac. Но ако сте потребител на Mac, това е страхотно нещо.


03. Скица. The.Ripper

Експортирането и подготовката на активи от Sketch за предаване на друг екип може да бъде истинско закъснение, така че перспективата за инструмент, който го прави вместо вас с едно кликване, е доста вълнуваща. Sketch.The.Ripper извлича и организира екраните, копира и растерни изображения от всички монтажни плочи във файл .sketch и ги представя по удобен начин. Можете да видите пример за изхода от извлечен файл тук.

Този инструмент е уеб-базиран, така че работи на всяка операционна система, която може да премахне известно триене от вашия работен процес, ако хората използват различни системи. Направен е от Icons8 и можете да прочетете повече за него тук.

04. Stackswell

Stackswell ускорява вашия реагиращ работен процес чрез въвеждане на мултимедийни заявки в Sketch и автоматизиране на процеса на актуализиране на типови стилове и символи за всяка точка на прекъсване. Вместо да извършвате тази работа ръчно, когато регулирате ширината на монтажната плоча, стиловете се актуализират автоматично.


Stackswell ви спестява и работата по проверка на вертикалното разстояние за всяка точка на прекъсване, така че получавате последователно разстояние с минимални неприятности. Можете да прочетете повече за това в тази статия.

05. Променливи шрифтове

Променливите шрифтове ви позволяват да използвате много различни тегла и ширини на шрифтовете, без да се налага да включвате отделен файл за всеки: включвате един файл и след това модифицирате шрифта с помощта на CSS. Това е чудесна ситуация, защото ви позволява да използвате типография с най-добрия ефект във вашите дизайни, без да се налага да увеличавате теглото на страницата си.

Не всички променливи шрифтове обаче са равни; някои са по-гъвкави от други. Този инструмент ви позволява да намерите различни шрифтове и да експериментирате с тях, за да видите дали отговарят на вашите нужди. За допълнителна информация относно променливите шрифтове и за да получите представа какво може да се постигне, опитайте тази демонстрация.

06. Фактуриране на ивици

Новият продукт за фактуриране на Stripe за онлайн бизнеса предлага трети начин за компаниите, които обмислят дилемата дали да изградят или купят система за фактуриране (за повече информация, вижте нашата статия за решенията за онлайн магазини). API на Stripe Billing се интегрира лесно в съществуващ сайт и ви позволява да използвате градивни елементи, за да създадете гъвкава система, съобразена с вашите нужди.

Когато системата ви е настроена, всичко се управлява от таблото, където можете да поддържате наред с абонаменти, фактури и финансови отчети. Получавате и мощни функции като глобалната система за разплащания на Stripe, която обработва различни валути и кредитни карти и гъвкавите компоненти за фактуриране, които ви позволяват да експериментирате с ценообразуването.

07. CreativeGuild

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

CreativeGuild има за цел да предостави някои от аспектите на общността онлайн, така че да е достъпен за повече хора. Можете да го мислите като нещо като LinkedIn, но за рекламни послания. Има директория на творчески компании, лица и работни места и можете да търсите по местоположение, за да намерите възможности във вашия град.

08. Мобин

Mobbin е галерия от дизайни на мобилни приложения, които можете да използвате, за да получите идеи за собствените си проекти - вместо да инсталирате много приложения, можете да ги разглеждате на едно място, за да видите как другите решават дизайнерските проблеми. Показват се шест екрана за всяко приложение, така че можете да получите представа за пътуването на потребителя и модела на дизайна за всеки един. Има и странична лента, показваща обяви за работа.

09. HueSnap

Никога не се знае кога ще вдъхнови вдъхновението; може би декорът на хотел или светлината в парка ще се почувстват като правилната цветова схема за вашата работа. Ако това се случи, можете да направите снимка и да използвате HueSnap, за да извлечете цветовете от изображението и да ги направите в палитра.

Приложението е насочено към мобилна употреба, така че работи най-добре на вашия телефон и можете да запазвате и споделяте палитрите си с други. Има различни функции, които ви помагат да модифицирате палитра, като опции за избор на допълващи се и съставни цветове. Вашите палитри могат да имат до шест цвята всеки.

За повече, разгледайте нашия обзор на най-добрите цветни инструменти за уеб дизайнери.

10. Градиенти

Който е събрал тази колекция от красиви градиенти, има страхотно око за цвят и интересно чувство за хумор. Всеки градиент се показва в контейнер с форма на яйце и му се дава име, което може по някакъв начин да се свърже с цветовете. Ако има връзка, не сме успели да я дешифрираме.

Примерните имена включват „Успешен имигрант“ за тюркоазен градиент, „Разбитото сърце на Возняк“ за бледосиньо и „Милостив враг“ за преход от жълто към зелено.

Вземете билета си за Generate New York

Водещо събитие за уеб дизайн Генерирайте Ню Йорк се завръща. Провеждат се между 25 и 27 април, сред водещите говорители са Dan Mall на SuperFriendly’s, консултант по уеб анимация Val Head, разработчик на пълни стекове за JavaScript Wes Bos и други. Има и ден на семинари и най-добрите възможности за работа в мрежа - не го пропускайте. Вземете вашия Generate билет сега.

Съветваме Ви Да Прочетете
10 зашеметяващо красиви зимни дизайни
Открийте

10 зашеметяващо красиви зимни дизайни

Настъпиха мехурчестите месеци на зимата, като много от вас се увиваха и уреждате за сериозен хибернация. Докато се разхождате за тези коледни дизайни в последния момент преди празниците, ние събрахме ...
8 основни SEO съвета за вашето онлайн портфолио
Открийте

8 основни SEO съвета за вашето онлайн портфолио

Създаването на блог е чудесен начин да изведете името си в бранша и да покажете знанията си. Но не е достатъчно само да изхвърлите статиите, трябва да се уверите, че и те могат да се намерят - особено...
8 най-модерни CSS функции (и как да ги използвате)
Открийте

8 най-модерни CSS функции (и как да ги използвате)

C непрекъснато се развива и множество нови вълнуващи функции са добавени, за да направят спецификацията още по-мощно оръжие в инструментариума на уеб дизайнер.C Grid извежда оформленията на нови нива,...