Изменить, чтобы уточнить Спасибо за существующие ответы. Боюсь, вы неправильно поняли мой вопрос. Я не хочу создавать мокапы (у меня есть, но они не подходят для моей текущей цели). Мне нужен инструмент (возможно, что-то столь же простое, как свободно доступная тема CSS), который сделает мой существующий, работающий наполовину законченный сайт ASP MVC похожим на макет.
Начальник моего начальника решил, что я должен показать текущую стадию своей работы своим заинтересованным сторонам, чтобы они могли почувствовать веб-приложение, которое я для них разрабатываю. Это разработка с нуля, поэтому у пользователей не возникает ожиданий, связанных с предыдущей версией. Он хочет, чтобы это было хотя бы немного кликабельно, поэтому я не могу пойти и опубликовать макеты, над которыми я работаю. Это должна быть работающая версия текущей стадии разработки.
Я хочу, чтобы занятый, критически настроенный менеджер среднего звена понял, что то, что он видит, — это не то, что он собирается получить, а ранний набросок этого. Это очень деликатный вопрос, потому что мое заявление увеличивает бумажную нагрузку менеджера. Поэтому они уже враждебно относятся к проекту и склонны рассматривать прототип в худшем свете, делая выводы об ожидаемом качестве приложения из качества дизайна и жалуясь на отсутствие жизненно важных функций, реализация которых еще не началась.
Для этого я хотел бы придать своей странице нарисованный от руки вид, как обычные мокапы. Он должен издалека кричать: «Я — набросок», чтобы никто никогда не принял его за настоящую вещь.
Какие есть хорошие способы создать такой образ? Есть ли способ более эффективный, чем создание моего собственного мокапа CSS вручную? У меня сильно ограничено время, которое я могу потратить на такую задачу, и я также неопытен в дизайне. Идеальный вид мне не нужен, да и страницы не сложные, поэтому чем проще решение, тем лучше.
Первое, что приходит на ум, это использовать для создания макета такой инструмент, как Balsamiq . Это придает ему очень «незавершенный» вид:
К сожалению, я не верю, что вы можете экспортировать рабочий HTML/CSS из Balsamiq, поэтому вместо этого я бы использовал их стиль в качестве вдохновения для создания вашего «макета CSS».
Вероятно, это потому, что я каждый день имею дело с Photoshop, но шахматная сетка всегда ассоциируется у меня с чем-то незавершенным.
Если бы не это, то, возможно, какая-то сетка, используемая для фона, помогла бы передать незаконченный вид.
Примером чего-то подобного, который я видел в прошлом, является старый стиль для бета-сайтов Stack Exchange:
Он очень бледный, но вы можете видеть, что они использовали сетку в качестве фона среди других элементов стиля, чтобы придать ему очень незавершенный вид.
Подобно Balsamiq, это Wireframe Sketcher. Это позволяет кликабельность.
Еще одна похожая программа, но с открытым исходным кодом и бесплатная — Pencil .
Чарльз Уэсли
Джон
Джон
Данияр
border-image
может позволить гибкие элементы с рамками в виде набросков.