Дом Работа Обо мне

Интерфейс GREENTESTER

GREENTESTER – устройство для определения вредных веществ в продуктах

GREENTESTER – устройство для определения вредных веществ в овощах и фруктах.


Краткое описание

Компания: HongKong Anmez Technology Co.,Ltd.

Роль: разработка интерфейса, дизайн


Задача: разработать удобный интерфейс тестирования продуктов и настройки гаджета.


Ограничения:

  1. Ширина экрана: 3,7мм.
  2. Разрешение экрана: 240x320px.
  3. Резистивный экран.
  4. Три языка локализации: английский, китайский упрощенный и традиционный.
  5. Слабый процессор для отрисовки графики.
  6. Ориентировка на китайских пользователей.

Прототип. Кликабельно.

Учитывая ограничения, разработан прототип интерфейса. Никаких жестов и свайпов — только нажатия на экран. Максимально крупные элементы управления и текст.

Страница прототипа для детального изучения.

Интерфейс.

Дизайн интерфейса Greentester

Дизайн.

Дизайн интерфейса Greentester Дизайн интерфейса Greentester Дизайн интерфейса Greentester

Экраны настроек:

Дизайн интерфейса Greentester Дизайн интерфейса Greentester Дизайн интерфейса Greentester Дизайн интерфейса Greentester Дизайн интерфейса Greentester

Экраны результатов проверки:

Дизайн интерфейса Greentester Дизайн интерфейса Greentester Дизайн интерфейса Greentester

Разработаны пиктограммы индикатора заряда батареи устройства. Градация: 6 делений, плюс отсутствие заряда и процесс заряда.

Индикатор заряда батареи Индикатор заряда батареи Индикатор заряда батареи Индикатор заряда батареи Индикатор заряда батареи Индикатор заряда батареи Индикатор заряда батареи Индикатор заряда батареи

Однако в последнем случае показывается отдельный экран.

Дизайн интерфейса Greentester

Обновление

После завершения разработки появились новые новые требования и необходимость доработки интерфейса.

На экран настроек добавилась кнопка информации об устройстве. Использоваться будет крайне редко, поэтому расположена на этом экране, а не на главном.

Измененный экран настроек

Изменение списка фруктов

Были разработаны несколько версий списка фруктов, так как у заказчика появилось желание изменить расположение кнопок листания списка.

Варианты интерфейса списка фруктов Варианты интерфейса списка фруктов Варианты интерфейса списка фруктов

После обсуждения всех вариантов было решено вернуться к первоначальному варианту, так как он оптимален в данных условиях при существующих ограничениях.

Разделение списка на фрукты и овощи

Так же появилась необходимость разделить список на фрукты и овощи. Варианты решения:

Выбор фрукты/овощи на главном экране Экран выбора списка фрукты или овощи

Для главного экрана сделаны несколько вариантов фонового изображения, в том же стиле, но мягче по цветам.

Дизайн интерфейса Greentester Дизайн интерфейса Greentester Дизайн интерфейса Greentester Дизайн интерфейса Greentester

Финальная версия главного экрана

Для лучшего визуального считывания кнопок добавлены пиктограммы фрукты/овощи. Сделаны варианты нажатых кнопок.

Главный экран Главный экран с нажатыми кнопками

Благодарю компанию HongKong Anmez Technology Co.,Ltd. за сотрудничество.

comments powered by Disqus