Affordance

Affordance представя продуктовата работа така, както дизайнерите я обясняват на ревю: меко сиво платно, бели карти в ритъм от 4px, заоблени етикети, заглавия с Instrument Sans и надписи с Geist Mono, и един индигов акцент. Екраните имат номерирани пояснения, макетите стоят в рамки на телефон и лаптоп, нарисувани с CSS, а резултатите се показват като карти с метрики и промяната в зелено.

Темата е изградена върху портфолио основата на Symelo, затова проектите са истински тип съдържание със собствени полета, а всичко по-долу работи без конструктор на страници:

• Проекти: меню Projects с дисциплини и индустрии, клиент, година, роля, продължителност, местоположение, инструменти, линк към живия проект, резюме, галерии в четири оформления, плъзгач „преди/след“, предизвикателството / подходът / резултатът на казуса, резултати, участници, цитат от клиента, карта и следващият проект. Стойностите се редактират с безплатния плъгин Secure Custom Fields (темата предлага да го инсталира) и продължават да се показват и без него.
• Карти с казуси: архивът с проекти е списък от карти в две колони с резюмето и основната метрика; началната страница започва с три избрани казуса, подредени като застъпващи се карти.
• Работа с филтри: дисциплините като моноширинни етикети, търсене и сортиране; мрежата се обновява без презареждане, адресът остава годен за споделяне и всичко работи и без JavaScript.
• Казусите като обстойни текстове: лента за напредъка в четенето, залепено съдържание „On this page“ с фактите за проекта, номерирани секции за предизвикателството / подхода / резултата, карти с метрики за въздействието, плъзгач „Old flow / New flow“ преди/след, екрани, цитатът на клиента, екипът и следващият казус.
• Анотирани екрани: екранна снимка с номерирани точки-пояснения и съответстваща номерирана легенда, за да обясните дизайнерските си решения.
• Hero секции: купчина карти с казуси, бенто с метрики, макети на лаптоп и телефон, времева линия Discover / Define / Design / Deliver и начало с отзив от клиент.
• Вашето студио: значка за свободност („Available for work from …“) в хедъра, hero секцията и футъра; данни за студиото, клиентите като бягаща лента, наградите като индексна таблица, услугите като номериран списък.
• Форми: форма за запитване за проект (сама попълва проекта, от който идва посетителят), форми за контакт, за предложение за сътрудничество и за бюлетин. Съобщенията се пазят в таблото и се изпращат на имейла ви.
• Видео: представителни видеа за проекти и публикации.
• Галерии: стиловете на галерия Masonry и Carousel и лайтбокс с надписи, плъзгане с пръст и управление от клавиатурата.
• Анимации: спокойни появявания отдолу нагоре, мрежи с поетапна поява и леко пулсиращи пояснения; всичко е изключено за посетители, които предпочитат намалено движение.
• Светла и тъмна схема: превключвател в хедъра, който помни избора на посетителя, и три стилови варианта освен основния: Figma-ish, Mint и Lavender, всеки със собствена тъмна двойка.

Шаблони: начална страница на блога, единична публикация, страница, архив, търсене (проекти, публикации и страници заедно), 404, страницата на проект, архивът с проекти, архиви за дисциплини и индустрии, както и потребителските шаблони Landing page, Wide и Case study. Части от шаблон: хедър, хедър върху hero изображение, футър и минимален футър.

Над петдесет блокови модела: шест hero секции (изявлението affordance, индексът на проектите, шоурийлът, последният проект, разделен портрет и бягаща лента с дисциплините), избрана работа, индексът на проектите, мрежата с филтри, акцент върху проект, услуги, процес, студиото в числа, клиенти, награди, отзиви, въпроси, галерии, видео секции, форми, списъци със статии от дневника, призиви за действие, социални линкове и цели страници за Home, Work, Studio, Contact и Landing page.

Демо съдържанието (Външен вид → Import demo) инсталира цяло творческо студио с девет проекта, дисциплини, индустрии, клиенти, награди и страниците Home, Work, Studio и Contact.