Инструмент макета пользовательского интерфейса и каркаса для пользовательского интерфейса приложения Mac OS X [закрыто]

Я ищу информацию от опытных дизайнеров, так как моя основная работа связана с кодированием, а не столько с дизайном...

Какие есть хорошие инструменты, которые можно использовать для создания макетов некоторых интерфейсов в стиле OS X? Было бы предпочтительнее что-то более современное, а не инструмент, который был пчелиным коленом в 2006 году или что-то в этом роде.

Также, если это приложение для Mac, то еще лучше. Заранее спасибо!

У меня нет никакого опыта дизайна пользовательского интерфейса, но я скажу: будьте осторожны, насколько хорошо это выглядит на раннем этапе. Независимо от того, сколько раз вы им говорите, они начнут редактировать текст и выравнивание пикселей, а не придерживаться общей картины и основных концепций, которые вы надеетесь сгладить.
Спасибо за указатель. Итак, вы говорите, что это должно быть очень просто, потому что чем лучше оно выглядит, тем больше они будут одержимы его внешним видом, а не функциональностью?
Да. Я думаю, именно поэтому многие инструменты макета имеют ощущение «альбома для рисования».
Вы спрашиваете о высококлассных макетах пользовательского интерфейса или набросанных макетах каркаса? Или оба? Или ни то, ни другое?
Я буду вторым Горацио. Я считаю, что демонстрация макетов с высокой точностью (то есть, они выглядят почти как настоящие) может быть огромной уловкой 22 и часто приводит к большому количеству недопониманий клиентов. Это также побуждает клиента сосредоточиться на цветах и ​​шрифтах, а не на таких вещах, как бизнес-цели, удобство использования и пользовательские задачи.

Ответы (3)

Я думаю, что этот вопрос задавался раньше, но я еще не нашел его, и если вы выполните поиск в Google инструментов для создания каркасов или инструментов для создания макетов, вы получите огромный список, который нужно пройти. Тем не менее, некоторые люди используют Omnigraffle для макета, и если бы мне пришлось использовать, я бы это сделал.

Другие инструменты:

В зависимости от того, что вы делаете и имеете приличные дизайнерские навыки, я создам ваш собственный макет в Illustrator или Photoshop.

Редактировать в соответствии с вашим комментарием

Спасибо, Грампс. Причина, по которой я спросил, заключалась в том, что из-за огромного количества доступных инструментов я пытаюсь найти лучший из тех, которые используют большинство моих дизайнеров. Так же, как Photoshop и Illustrator де-факто.

Кто-то скажет, что Onmigraffle или balsamiq являются самыми популярными, но если вас беспокоит дизайн, я бы посоветовал вам реализовать дизайн в браузере, потому что это приведет к наилучшему результату и будет проще при переходе от макета к рабочему сайту. Просто имейте в виду, что всегда будет некоторая разница между дизайном на бумаге и реальным кодом. Не беспокойтесь о CSS или визуальных элементах в этом направлении, которые работают на предполагаемом устройстве:

введите описание изображения здесь

Спасибо, Грампс. Причина, по которой я спросил, заключалась в том, что из-за огромного количества доступных инструментов я пытаюсь найти лучший из тех, которые используют большинство моих дизайнеров. Так же, как Photoshop и Illustrator де-факто.
нет ничего лучше, чем реальное проектирование в браузере, на который я перешел. Тем не менее, я бы сделал каркас основных компонентов, которые вам понадобятся, и анимацию, после чего вы можете представить рабочий прототип, но сделать его простым, возможно, черно-белым. Я отредактирую свой ответ, чтобы отразить пример.
Мне очень нравится знать, какой инструмент использовался для создания каркаса чертежа внизу вашего ответа? Это выглядит здорово!
Сандер: Думаю, это трафарет graffletopia.com/stencils/1205 для Omnigraffle.
Fwiw, ссылка OmniGraffle выдает ошибку «недоступно в магазине США в это время» — общая ссылка на страницу Graffle OmniGroup здесь .

Вы пробовали использовать раскадровки xCode? Невозможно получить больше похожего на приложение Apple, чем это, и xCode содержит все виды элементов, которые когда-либо можно было поместить в приложение OSX.

Я только что попробовал использовать Omni-Graffle (версия 5), и я должен сказать, что есть некоторые серьезные препятствия, если вы занимаетесь дизайном экрана:

  1. Размеры шрифта указаны не в пикселях и не являются правильными: если я ввожу текст в OmniGraffle и задаю ему размер 12, а затем экспортирую экран в формате PNG и открываю его в Photoshop, размер текста на самом деле составляет 9 пикселей. Если я ввожу 18, в фотошопе будет 15 и т. д.

  2. Цвета: OmniGraffle плохо обрабатывает цвета. Он основан на яблоках, встроенных в палитру цветов, что дает неточные результаты. Например: например, я создаю красный с 255 0 0 или # ff0000. Если я сейчас воспользуюсь инструментом выбора цвета в OmniGraffle и нажму на только что созданный красный цвет, то теперь он будет 242 0 0.

  3. Размер экрана: вы не можете установить размер экрана в пикселях, только в точках (pt).

Теперь я также ищу надежный инструмент для создания каркасов и макетов. Однако я не могу винить OmniGraffle. На самом деле это инструмент для создания блок-схем и не предназначен для каркасов.

Некоторые примечания: размеры шрифта не совпадают с размером буквы в пикселях. Omnigraffle действительно предназначен для вайрфрейминга, а не визуального дизайна.