Что такое каркас?

Ok. Я знаю, что такое каркас, но мне все еще нужна большая помощь. Вопрос действительно хочет спросить, как начать работу, когда «проектирование» каркаса для интернет-магазина. Я занимаюсь интернатурой в веб-дизайне, и на данный момент моя задача - создать общий каркас для интернет-магазина, который продает автомобили. Знаете ли вы какие-нибудь прекрасные примеры таких сайтов? Каковы «шаги», которые я хочу отслеживать, когда я создаю этот первый каркас?

Я собираюсь сделать каркас в Photoshop, хотя я знаю его слишком много, чем то, что мне нужно. Я сделал несколько базовых каркасов с Balsamiq Mockups, что является отличной программой для каркаса только для того, чтобы не выглядеть так замечательно, когда вы хотите представить каркас клиенту, а не то, что каркас должен выглядеть хорошо или что-то еще, но отрывочный взгляд Balsamiq - это бит до грубого. Я не думаю, что мне понадобятся какие-нибудь советы для Photoshop, когда дело доходит до простого каркаса, потому что я просто буду использовать базовые инструменты и только оттенки серого, и, возможно, я также подумаю о размере шрифта, но я не знаю Не думаю. В любом случае, если вы считаете, что у вас есть какие-либо советы по созданию каркасов с Photoshop, все приветствуются! Спасибо вам

11 голосов | спросил Flavius Frantz 1 J0000006Europe/Moscow 2011, 14:42:54

5 ответов


14

Хорошо, для начала, если это стажировка, этот вопрос действительно должен быть адресован вашим наставникам и сотрудникам. Цель стажировки - учиться у них.

Тем не менее, каркас - это эскиз для передачи идеи /концепции. Термин происходит от 3D-моделирования, где каркас - это базовые примитивы объекта, чтобы дать ощущение формы и масштаба, не переходя к полностью визуализированной модели. (Который перед компьютерами должен был быть сделан вручную с помощью физических моделей, которые часто начинались как «каркас проволоки», на который была нанесена глина или другой такой субстрат, чтобы сформировать форму).

В контексте веб-сайтов каркасы служат различным целям в зависимости от контекста проекта. Они могут включать:

  • поток сайта (обычно выполняется с блок-схемами)
  • взаимодействия (не всегда легко документировать в каркасе, но его общий)
  • общая структура содержимого
  • общий макет страницы

Я бы не использовал Photoshop для каркасов вообще. Это соблазнит вас добавить визуальный дизайн, и это не то, что вы хотите в своих каркасах. Придерживайтесь Balsamiq или, даже лучше (IMHO, конечно) - придерживайтесь ручкой и бумагой.

Что касается большого веб-сайта, который продает автомобили, я не уверен, что видел его еще. ;)

Но обратите внимание, что, смотря на другие автомобильные сайты, важно, ваш каркас действительно должен быть построен вокруг бизнес-целей вашего клиента. В идеале у вас уже есть некоторые персонажи и проектные требования для работы.

P.S. этот вопрос, вероятно, следует перенести в UX

ответил DA01 1 J0000006Europe/Moscow 2011, 17:18:45
4

Уже есть несколько хороших ответов на ваши основные вопросы, поэтому я просто добавлю несколько предостерегающих замечаний:

  • Будьте осторожны с запросами типа «можете ли вы добавить цвет?» или «давайте сделаем это красиво». Это не для каркаса. Он фокусируется на использовании страницы, концепции, а не на внешнем виде.
  • Будьте готовы к повторению. Ваши первые усилия могут быть очень грубыми - последующие усилия затягивают его. Не пытайтесь заставить все в каркасе версии 0.1.
  • Попросите каркасы из предыдущих проектов, чтобы узнать, что делали в прошлом компании. Это даст вам хороший подход к конкретному использованию каркасов для компаний (нет золотого стандарта - я сделал каркасы для большего количества компаний, чем я помню, и у всех были несколько разные ожидания).
ответил gef05 2 J0000006Europe/Moscow 2011, 18:37:36
4

Каркас - это прототип или быстрый проект того, где вещи будут размещены на веб-странице. Каркас подчеркивает размещение и форму. Некоторые из них относятся к сфере функциональности.

Общая цель - сосредоточиться на удобстве использования и опыте пользователей.

Существуют различные инструменты, которые могут выполнить это: Photoshop, иллюстратор, indesign. Существуют также инструменты, разработанные специально для этой цели.

Независимо от того, что каркас можно также нарисовать.

Подробнее об этой теме: http://wireframes.linowski.ca/ - Журнал каркасов

Пример реальных каркасов, отображаемых клиенту (страница беспроводной сети Verizon)

http://boxesandarrows.com/real-wireframes-get-real- результаты /

ответил chrisjlee 2 J0000006Europe/Moscow 2011, 04:49:05
1

Существует два подхода к созданию магазина электронной торговли:

  1. Начните с каркасов /макетов, наполненных бессмысленными «lorem ipsum», а затем немного погубите, пытаясь получить «подписанные» функции для работы с выбранным вами решением электронной коммерции и реальной информацией о продукте.
  2. Начните с шаблонов по умолчанию для программного обеспечения электронной торговли, где функциональность /юзабилити все разработано (хотя и не соответствует вашим вкусам). Поместите некоторые реальные данные о продукте вместо мусора «lorem ipsum». Теперь пройдите через покупку путешествия продукта, сохранив несколько экранов по пути.

Второй подход, объединенный с локальной таблицей стилей и некоторыми изменениями в firebug css, заставит вас работать с каркасом, который вы можете доставить, вы также не будете игнорировать такие вещи, как окна сообщений, которые сообщают вашему клиенту, что они добавили их корзину и т. д. Вы также не пропустите такие вещи, как кнопки области учетной записи.

В наши дни рисунки стиля Balsamiq становятся немного утомительными - cheezier чем Comic Sans. Почему макет, как колесо должно быть изобретено, когда программное обеспечение вашей корзины подчиняется соглашениям, в которых должна идти учетная запись /поиск /навигация?

Существует также эта концепция использования сеток. Вы можете провести весь день в Photoshop, помещая материал в макеты сетки, или вы можете сделать это с помощью ручки и бумаги. Получите лист A4, сложите его в полтора раза, и у вас есть сетка для компоновки вашего заголовка, изображения продукта, описания, покупки и других кнопок. Реализуйте это с помощью некоторых быстрых прототипов с таблицей firebug /local style.

ответил ʍǝɥʇɐɯ 6 J0000006Europe/Moscow 2011, 16:04:22
1

Вот как я пытаюсь отключить мои друзья:

  1. Возьмите любой веб-сайт, который вам нравится, разделите его на все его цветки, затем разделите его на все его содержимое и /или цифровые активы (изображения, видео и т. д.).

  2. Продолжайте повторять этот процесс до тех пор, пока все, что у вас осталось, - это черно-белая страница с фигурами, которые, как представляется, образуют своего рода план, который при заполнении элементами из № 1 составляет сайт, с которого вы начали.

Шансы - каркасы для этого конкретного сайта выглядят довольно близко к тому, что вы себе представляете.

ответил zsiberian 17 thEurope/Moscowp30Europe/Moscow09bEurope/MoscowSat, 17 Sep 2011 00:38:14 +0400 2011, 00:38:14

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132