Користите Фирефок да креирате једноставне макете

Оловка је алатка за жичану обраду која можемо користити за скицирање модела корисничког интерфејса наше апликације. Одлична ствар код Пенцил-а је што је лаган, једноставан за употребу и чврсто интегрисан са Фирефок-ом. На врху свега је његова бесплатна апликација отвореног кода! На крају чланка даћемо вам једноставан демо о томе како користити Пенцил да бисте креирали Бриззли вирефраме..

Зашто креирамо вирефрамес ?

Жичани оквир је скица идеје за изглед странице. Жичани оквир се фокусира на информацијски дизајн странице како би се осигурало да се дизајн уклапа у оно што је кориснику потребно. Жичани оквир се обично састоји од различитих облика (као што су кутије, овали и дијаманти) за приказ садржаја, функционалних и навигацијских елемената. Ови облици приказују њихов положај на страници.

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

Почетак рада са оловком

Преузмите Пенцил фром Пенцил'с адд онс страницу. Када инсталирате Оловку, она је доступна са „Алатке“> „Скицирање оловком“.

Тако изгледа Бриззли. То је прилично цоол веб апликација која агрегира Фацебоок и Твиттер унутар једне странице.

Ово је крајњи резултат жичаног оквира. Главни облици у овом жичаном оквиру су, правоугаоници, текстуални оквири и картице. Следећи део чланка ће дати једноставан пример како да направите сваки облик.

Креирање правоугаоника

Први корак у креирању облика жичаног оквира је да повучете облик из менија „Облици збирки“ на платно.

Промените величину правоугаоника на одговарајућу ширину и висину.

Можемо прилагодити текст, обруб и боју позадине било којег облика у Пенцил-у. Кликните десним тастером миша на правоугаоник и изаберите 'Својства' да бисте отворили прозоре Својства. Ово је екран са својствима позадине. Поставите боју позадине правоугаоника на белу (#ФФФФФФ).

Кликните на картицу 'Граница' и подесите особине границе. Подесите боју обруба на црно (# 000000) и промените тежину границе на 1.

Екран карактеристика текста омогућава нам да прилагодимо врсту фонта, величину, стил, тежину, боју, осветљеност и непрозирност текста.

Креирање картица

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

Отворите екран са својствима текста да бисте подесили боју фонта картице „Слике“ и „Нацрт“. Постави на сиво (# 989898).

Креирање текста

Превуците облик „Текст“ на платно да бисте креирали сваки од менија. Можемо прилагодити изглед текста приступањем прозору са својствима текста.

Корисни савети за промену боје

Боја је један од најважнијих у пружању угодног жичаног оквира. Најпрецизнији начин да промените боју облика је одређивање ХТМЛ кода боје. Израчунавање ХТМЛ кода за одређену боју може бити тешко. Можемо користити ХТМЛ шифру за боје од в3цсцхоолс.цом да бисмо пронашли одговарајући ХТМЛ код за одређену боју.

Такође волимо да користимо цолорзилла да изаберемо боје са екрана и користимо је у Пенцил-у. Кликните на икону капаљке у доњем левом углу Фирефока да бисте изабрали боју на екрану. Такође можемо отворити ЦолорЗиллин избор боја тако што ћемо двапут кликнути на икону капи ока. Само копирајте Хек код у ХТМЛ код боје Пенцил.

Закључак

Оловка је једноставна за употребу. Интеграција оловке са Фирефок-ом нам омогућава да користимо други плугин за Фирефок да бисмо помогли у креирању бољег вирефраме-а

Линкови
Довнлоад Пенцил
Довнлоад Цолорзилла
В3Ц ХТМЛ Цолор Цхеат Схеет