Десет Ливинг Стиле Гуиде Алати за веб дизајнере - Бест оф

А водич за стил живота је документација УИ елемената и образаца прикупљене са сајта или апликације са циљем да омогуће програмерима да их користе доследне стилове у целом пројекту. У прошлости, програмери су ручно креирали стилске водиче, што је много посла. После неког времена, почели су да аутоматизују радне процесе и алате за вођење стилова који трансформишу фронт-енд код у добро организоване библиотеке УИ почели да се појављују.

Водичи живог стила се разликују од водичи за стил кодова, јер потоњи садрже правила о писању читљивог и одрживог кода, док су живи водичи у стилу колекције фронт-енд образаца, као што су ЦСС класе за дугмад, виџете и типографске елементе. Водичи за стил кодова осигуравају конзистентност кода, док водичи живог стила обезбеђују визуелна доследност преко сајта.

У овом посту смо саставили 10 практичних алата који вам могу помоћи генеришите сопствени водич за стил живота.

1. Стилифи Ме

Овај алат је веома забаван: само залијепите линк веб странице коју желите анализирати и гледајте како се његов стилски водич генерира једним кликом миша. Са Стилифи Ме, можете брзо добити преглед узорака сајта, укључујући боје, фонтове, димензије и размаке. Када се процес заврши, можете преузмите водич за стил у ПДФ-у.

2. Фабрицатор

Фабрицатор вам омогућава да направите свој властити алат за кориснички интерфејс, организујете систем дизајна и генеришете водич за стил из кода алата. Ако радите у тиму, можете да напишете документацију у Маркдовн-у да бисте другим програмерима олакшали употребу. То вам може помоћи организујте своју рутину дизајна / кодирања на начин који ти се свиђа.

3. Фронтифи

Фронтифи укључује све од дигиталних модела до вирефраминг-а. Они такође имају алат за водич кроз стил који нуди чист минималистички процес дизајна без муке. Можете се бесплатно пријавити и ручно унети све потребне информације. Процес треба да укључује палету боја, изборе фонтова, иконе, логотипе, евентуално слогане или преферирану веб копију.

4. Аигис

Са Аигис, можете креирати водиче стила из било које текстуалне датотеке (нпр. .цсс, .сцсс, .стил, .доктор медицине). Такође можете да напишете документацију у Маркдовн-у и да прилагодите тему сајта.

5. Холограм

Холограм је креирао Трулиа, и одлично је рјешење за генерирање стилских водича. То је Руби драгуљ анализира коментаре у вашем ЦСС-у у циљу генерисања сјајних стилских водича. Холограм има систем темплата са неким основним стиловима и навигацијом како би ваш стилски водич био још лакши.

6. Стиледовн

Са Стиледовн, лако можете написати ЦСС стилске водиче, јер је то Генератор водича заснован на Маркдовн-у. Радит ће с већином веб развојних поставки, будући да је платформски неутралан. Потребно је врло мало да се покрене и покрене. Такође, коментари које требате додати вашем ЦСС-у су врло минимални. ЦСС документацију можете креирати или у уграђеним ЦСС коментарима, или као засебну Маркдовн датотеку.

7. КСС

КСС (листови стилова Книле) је првенствено а спецификација документације и формат стилског водича који има сопствену синтаксу за коментарисање. КСС такође укључује Руби библиотеку која анализира .сасс, .сцсс, и .цсс датотеке документоване са КСС смерницама у уредном водичу за стил. КСС је за напредније кориснике и професионалне тимове, јер генерисање водича за стил са њим захтева знање о кодирању.

8. Генератор водича за стил СЦ5

Са Генератор СЦ5 Стиле Гуиде можете креирати и уређивати стилске водиче директно у прегледнику. То је на основу КСС са неким занимљивим карактеристикама, као што је кориснички интерфејс који користи АнгуларЈС који вам помаже да прегледате, претражујете и тестирате ваше стилове. СЦ5 користи исту нотацију документа као и КСС. Подржава САСС, ЛЕСС, ПостЦСС и чисте ЦСС стилове.

9. Стиледоццо

СтилеДоццо је згодна Ноде.јс апликација која ствара стилске водиче из ваших стилских листа. Можете га инсталирати са нпм. У генерисаном стилу, СтилеДоццо приказује преглед са стиловима које сте применили и пример ХТМЛ кода.

На почетној страници СтилеДоццо, можете пронаћи два примјера водича за стил, један генериран из задане стилске таблице, а други генериран из Боотстрап странице. Примери вам такође могу помоћи да подигнете синтаксу документације коју СитлеДоццо користи.

10. Лаб Лаб

Паттерн Лаб је скуп алата који вам помажу да креирате систем модуларног дизајна. Узорак Лаб је прилагођени статички генератор страница који повезује све елементе стила на локацији и формира предлошке и странице од њих. Може послужити као пројект либрари либрари и фронтенд стиле гуиде. Лаб Лаб вам омогућава да истовремено видите ваше компоненте стила апстрактно и у контексту.