Сверстать WebApp с использованием CSS UI
фреймворка
5 000 руб. за проект
Добрый день!
Предлагайте свои цены и методы решения задачи!
Необходимо сверстать адаптивную WebApp страницу для небольшого домашнего проекта.
ПРИВЕТСТВУЕТСЯ: jquery, Bootstrap, Propeller, UIkit, Font Awesome, ваши предложения
НЕДОПУСТИМО: nodejs, php
Используемые устройства: смартфон (iPhone 6/7), планшет (iPad/ iPad mini)
Также необходимо поддерживать использование ОС Android, по размерам дисплеев можно ориентироваться на указанные устройства Apple.
Использование WebApp предполагает адаптивную верстку в вертикальной и горизонтальной ориентациях.
Для использования WebApp на экране приложений мобильного устройства пользователя вручную создается ярлык на адрес сервера (http://1.2.3.4/).
На главной странице (index.html) должны быть заданы метатеги, отключающие интерфейс мобильного браузера (iOS и Android), а также отключающие скроллинг и полосы прокрутки.
WebApp должен занимать максимальное пространство на дисплее пользователя.
Главная страница (index.html) интерфейса должна представлять собой iOS-like приложение:
(вертикальная ориентация)
В верхней части - заголовок подстраницы
В центральной части - "тело" подстраницы
В нижней части - панель управления питанием и громкостью
(горизонтальная ориентация)
В верхней части - заголовок подстраницы
В центральной части - "тело" подстраницы
В правой части - панель управления питанием и громкостью
Пользователь нажимает созданный ранее ярлык и загружается странциа без интерфейса браузера и скроллинга. Браузер получает весь необходимый для интерфейса контент (.html .css .js .png и т.д.), чтобы при использовании WebApp не происходило обновлений страниц.
Каждая подстраница представляет собой отдельный .html файл с
Предлагайте свои цены и методы решения задачи!
Необходимо сверстать адаптивную WebApp страницу для небольшого домашнего проекта.
ПРИВЕТСТВУЕТСЯ: jquery, Bootstrap, Propeller, UIkit, Font Awesome, ваши предложения
НЕДОПУСТИМО: nodejs, php
Используемые устройства: смартфон (iPhone 6/7), планшет (iPad/ iPad mini)
Также необходимо поддерживать использование ОС Android, по размерам дисплеев можно ориентироваться на указанные устройства Apple.
Использование WebApp предполагает адаптивную верстку в вертикальной и горизонтальной ориентациях.
Для использования WebApp на экране приложений мобильного устройства пользователя вручную создается ярлык на адрес сервера (http://1.2.3.4/).
На главной странице (index.html) должны быть заданы метатеги, отключающие интерфейс мобильного браузера (iOS и Android), а также отключающие скроллинг и полосы прокрутки.
WebApp должен занимать максимальное пространство на дисплее пользователя.
Главная страница (index.html) интерфейса должна представлять собой iOS-like приложение:
(вертикальная ориентация)
В верхней части - заголовок подстраницы
В центральной части - "тело" подстраницы
В нижней части - панель управления питанием и громкостью
(горизонтальная ориентация)
В верхней части - заголовок подстраницы
В центральной части - "тело" подстраницы
В правой части - панель управления питанием и громкостью
Пользователь нажимает созданный ранее ярлык и загружается странциа без интерфейса браузера и скроллинга. Браузер получает весь необходимый для интерфейса контент (.html .css .js .png и т.д.), чтобы при использовании WebApp не происходило обновлений страниц.
Каждая подстраница представляет собой отдельный .html файл с
контейнером внутри.
Подстраницы должны быть включены в основную index.html. По умолчанию, все кроме первой подстраницы должны быть скрыты.
Переходы по подстраницам осуществляются с помощью кнопок , посредством показа одной И скрытия всех остальных подстраниц (например, style="display:none;" или class="hidden" и т.д.)
Необходимо использовать компоненты CSS UI фреймворка, который мы согласуем с кандидатом в процесса общения, а также использовать иконки там где это будет необходимо.
На главной странице располагаются большие кнопки для перехода на подстраницы (Освещение, Звук, ТВ, Камеры, Звонок, Коммутация 1, Коммутация 2)
Панель управления питанием и громкостью должна быть видна на всех подстраницах для быстрого доступа к элементам управления: выкл/вкл питания, громкость+/-/mute, микрофон mute
На любой странице кроме главной в верхней части страницы слева от заголовка подстраницы должна появляться иконка (кнопка) Домой для возврата на Главную страницу
На подстранице Освещение должны располагаться слайдеры (ползунки) для 5 комнат, а также кнопки для выбора предустановленных сценариев
На подстранице Звук должны располагаться кнопки уменьшения, увеличения и вкл/выкл громкости для 4 комнат, а также индикатор текущего уровня громкости (progress bar)
На подстранице ТВ должны располагаться кнопки выбора входа ТВ, кнопки меню и навигации, управления громкостью ТВ, возможно еще нужен всплывающий список для избранных телеканалов
На подстранице Камеры должны располагаться кнопки управления PTZ, выбора камеры (для возможности переключаться между 4-мя камерами) и кнопки для вызова предустановок
На подстранице Звонок должны располагаться кнопки телефонной клавиатуры, поле ввода номера, кнопка удаления последнего символа, кнопки принятия и отклонения вызова и кнопка удержания вызова
На подстранице Коммутация 1 в столбик должны располагаться названия комнат (Room1, Room22, Room333, Room4444), в соседний столбик располагаться выпагающие списки (dropdown) с предполагаемыми источниками (DVD, Blu-Ray, Radio, Vinyl, PS4, TV)
На подстранице Коммутация 2 должна отображаться коммутационная матрица, где в первом столбце описываются источники (DVD, Blu-Ray, Radio, Vinyl, PS4, TV), а в первой строке матрицы описываются названия комнат (Room1, Room22, Room333, Room4444), остальные ячейки матрицы - кнопки для коммутации. В одном столбце может быть выбрана только одна кнопка. В одной строке может быть выбрано любое количество кнопок.
Предлагайте свои цены и методы решения задачи!
Telegram: @im_err0r
Подстраницы должны быть включены в основную index.html. По умолчанию, все кроме первой подстраницы должны быть скрыты.
Переходы по подстраницам осуществляются с помощью кнопок , посредством показа одной И скрытия всех остальных подстраниц (например, style="display:none;" или class="hidden" и т.д.)
Необходимо использовать компоненты CSS UI фреймворка, который мы согласуем с кандидатом в процесса общения, а также использовать иконки там где это будет необходимо.
На главной странице располагаются большие кнопки для перехода на подстраницы (Освещение, Звук, ТВ, Камеры, Звонок, Коммутация 1, Коммутация 2)
Панель управления питанием и громкостью должна быть видна на всех подстраницах для быстрого доступа к элементам управления: выкл/вкл питания, громкость+/-/mute, микрофон mute
На любой странице кроме главной в верхней части страницы слева от заголовка подстраницы должна появляться иконка (кнопка) Домой для возврата на Главную страницу
На подстранице Освещение должны располагаться слайдеры (ползунки) для 5 комнат, а также кнопки для выбора предустановленных сценариев
На подстранице Звук должны располагаться кнопки уменьшения, увеличения и вкл/выкл громкости для 4 комнат, а также индикатор текущего уровня громкости (progress bar)
На подстранице ТВ должны располагаться кнопки выбора входа ТВ, кнопки меню и навигации, управления громкостью ТВ, возможно еще нужен всплывающий список для избранных телеканалов
На подстранице Камеры должны располагаться кнопки управления PTZ, выбора камеры (для возможности переключаться между 4-мя камерами) и кнопки для вызова предустановок
На подстранице Звонок должны располагаться кнопки телефонной клавиатуры, поле ввода номера, кнопка удаления последнего символа, кнопки принятия и отклонения вызова и кнопка удержания вызова
На подстранице Коммутация 1 в столбик должны располагаться названия комнат (Room1, Room22, Room333, Room4444), в соседний столбик располагаться выпагающие списки (dropdown) с предполагаемыми источниками (DVD, Blu-Ray, Radio, Vinyl, PS4, TV)
На подстранице Коммутация 2 должна отображаться коммутационная матрица, где в первом столбце описываются источники (DVD, Blu-Ray, Radio, Vinyl, PS4, TV), а в первой строке матрицы описываются названия комнат (Room1, Room22, Room333, Room4444), остальные ячейки матрицы - кнопки для коммутации. В одном столбце может быть выбрана только одна кнопка. В одной строке может быть выбрано любое количество кнопок.
Предлагайте свои цены и методы решения задачи!
Telegram: @im_err0r
В заказе есть исполнитель
При переводе заказа из архивного в актуальный, текущий исполнитель будет снят с задачи.
Выберите тип сделки
С безопасной сделкой вы всегда сможете вернуть средства, если что-то пойдет не так. С простой сделкой вы самостоятельно договариваетесь с исполнителем об оплате и берете на себя решение конфликтов.