Верстка и дизайн мобильного приложения на Ionic Framework (Angular)

Разрабатывать на Ionic Framework мобильные приложения, я начал за его преимущество кросс-платформенности, т.е. единого кода и для iOS и для Android. Но есть и еще одна деталь, которая сыграла огромную роль, о ней и расскажу.

До кросс-платформы, я писал нативные приложения для iOS на Objective-C и самая не любимая работа для меня была это как раз верстка приложения, особенно когда попадались очень «профессиональные дизайнеры», мол вот тебе jpg картинка, верстай…. Иногда была задача сверстать как-нибудь, лишь бы запустить приложение в стиле «дизайн сделаем потом», это щас не важно. Так вот на усмотрение, получалось крайне ужасно, стандартный элемент хоть и выглядел вполне как в операционной системе это принято, но вот отступы и сочетание было крайне ужасное.

Так вот в Ionic Framework можно с легкостью набросать типовых элементов, списки, формы, карточки и это будет смотреться почти шикарно сразу, чуть подкрути, повыбирай стили и отступы из нескольких возможных и вуаля.

Так вот сейчас проектов в Ionic стилях, примерно половина и это шикарная возможность сэкономить половину бюджета разработки.

Но от слов к делу…. Ниже на фото скрин экрана новостей одного из проектов в наброске, в данном проекте я стили не доводил до красоты, т.к. все равно будет макет дизайна. По факту это статичная HTML/CSS верстка.

наброски интерфейса в Ionic стилях

Дальше реализовывается функционал и на финальной стадии когда дизайнер все отрисовал, кстати для дизайнера это хороший прототип для его работы, верстка корректируется по дизайну.

интерфейс сверстанный по дизайну

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

Ну и для примера ниже приложение с объявлениями по подписке с доведенными стилями Ionic до приятного на мой взгляд вида.

приложение в Ionic стилях доведенное до ума

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *