Я и мой коллега только что завершили разработку очень сложного веб-интерфейса. Однако нам нужно перейти к дизайну интерфейса планшета. Есть ли способ уменьшить дизайн, чтобы он подходил для планшета, или нам нужно снова начать переделывать весь интерфейс в зависимости от размера планшета?
Пожалуйста помоги!
То, чего вы пытаетесь достичь, называется адаптивным веб-дизайном. Обычно разработчик, которого вы нанимаете для создания приложения, знает, как уменьшить дизайн для экранов меньшего размера.
Не уменьшайте весь дизайн (это также уменьшит размер шрифта). Сначала создайте новую монтажную область с тем же размером экрана, на который вы собираетесь нацеливаться. Затем работайте с каждым модулем (фрагментами/коробками). Если вы работали с простой сеткой из 12/16 столбцов в исходном дизайне, это должно быть очень легко сделать. Вам нужно иметь аналогичную сетку для новой монтажной области и уменьшить каждый модуль, чтобы соответствовать новым размерам сетки.
Ради примера. Скажем, исходный дизайн представляет собой сетку из 12 столбцов. И у вас есть функциональный модуль шириной в 3 столбца. И у вас есть 4 таких функции. Таким образом, вы занимаете всю строку (3x4). Теперь для монтажной области размера таблицы измените размер модуля, чтобы он соответствовал 4 столбцам. Отрегулируйте размер шрифта и отступы в этом модуле, если текст не переносится должным образом. (Убедитесь, что если вы изменяете размер шрифта для чего-то вроде стиля заголовка, вы должны повторить его на всей монтажной области). Модуль выглядит слишком тесным для места? Затем сделайте его шириной в 6 столбцов и займите два ряда (6х2 в каждом)
Вот как работает процесс принятия решений для адаптивного дизайна. Это не совсем редизайн всего, потому что некоторые части вашего дизайна могут не нуждаться в полной переработке, вам просто нужно уменьшить, скажем, фон. Вам также нужно изучить изменение размеров компонентов, если это необходимо, например, отступы для кнопок, поля под абзацами. Таким образом, если значение отступа вокруг текста в кнопке составляет 30 пикселей для экранов настольных компьютеров, для планшетов вы можете уменьшить его до 20-24 пикселей.
Объяснить весь процесс в точности невозможно. В Интернете есть много ресурсов, которые дадут вам советы и идеи. На Lynda.com есть похожее видео. Вы можете поискать похожие видео на YouTube. Удачи.