Switch to English?
Yes
Переключитись на українську?
Так
Переключиться на русскую?
Да
Przełączyć się na polską?
Tak
Разместите свой конкурс и выберите наиболее понравившуюся работу из предложенных!

Калькулятор для сайту-сервіса Друк-На-Вимогу

5000 UAH
Интерфейс


Дополнительные условия

Просмотр конкурсных работ доступен всем участникам


Использование стоковых изображений, а также AI допустимо
Заказчик
Євген Лео
Украина Киев
 6  0  1

Опишите проект, для которого нужно разработать дизайн интерфейса:  

сайт печать-по-требованию от 1 єкз


Ближайшие конкуренты:  

https://printto.ua
https://www.ice-print.com.ua/calc_books.php


Основные конкурентные преимущества:  

печать книг с твердым переплетом


Целевая аудитория проекта – кто и для каких целей будет его использовать:  

люди пользующиеся бумажными книгами


Основные функции интерфейса:  

предварительный расчет стоимости печати книги


Краткий сценарий взаимодействия интерфейса с пользователем:  

клиент вводит параметры книги (размер книги, цветность страниц, тип обложки (мягк. или тверд.), тираж) и получает стоимость 1 екз и общую сумму заказа 


Язык интерфейса:  

украинский


Есть ли у вас сайт и фирменный стиль?  

нет фирменного стиля, названия и логотипа


Есть ли прототип интерфейса?

  

робочий прототип калькулятора

https://u000042.stepform.io/LR9L5Nx


макет калькулятора

https://www.figma.com/file/QDFNkRtWeFirV4JHJcVHkx/%D0%9A%D0%B0%D0%BB%D1%8C%D0%BA%D1%83%D0%BB%D1%8F%D1%82%D0%BE%D1%80-(Copy)?node-id=0%3A1&t=AOH4k5fvMufrLM6J-1


Укажите любую дополнительную информацию, которую вы считаете важной.  

Проблемні місця - занадто високий Bounce % на калькуляторі, бо клієнт бачить, що від нього вимагають багато нецікавих йому дій.

Дизайн вже є, але ми хочемо його дещо осучаснити, облегшити, щоб виглядав цікавіше, бо зараз клієнт на цьому сайті змушений заповнювати довгі таблиці.
Коли клієнт бачить довжелезний поп-ап він просто уходить з сайту. І ми втрачаємо в конверсії.
Можливо в когось є бачення як взаємодію із клієнтом зробити більш ігровою.

Тому, чиє бачення даного інтерфейсу виявиться для нас найцікавішим, готові запропонувати розробити логотип і сайт


Посилання на ТЗ сайту
https://docs.google.com/document/d/169myBWfyQIaNLtD68hNnEzyNgcH20KWfKUVrSDkSmdM/edit?usp=sharing


Приклад дизайну що сподобався
Elekomp Store




Обновление #1 от 20 марта 2023, 13:40

Уважаемые дамы и господа, дизайнеры🙂

Большое спасибо, что вы откликнулись на этот проект.
Я просмотрел все ваши работы и понял, что мои ответы будут довольно однотипными и что в условиях конкурса было недостаточно конкретики. Итак, нужно предоставить некоторые уточнения и разъяснения.

Компоновка
Идея разделить интерфейс калькулятора на три экрана (этапа) довольно уместна для мобильных устройств и, возможно, планшетов, но для десктопов мы бы хотели сохранить возможность отображать калькулятор на одном экране. Например, выбирать вариант отображения калькулятора в бэкенде.
Возможно, этот вопрос больше к разработчикам, а не к дизайнерам.


Порядок блоков
Сначала клиент выбирает формат файла, из которого будет печататься книга.
Формат файла определяет, какого размера будет книга и сколько страниц она будет иметь.
Затем клиент выбирает обложку (твердая/мягкая).
И цвет блока страниц (цветной, черно-белый).

Таким образом, оптимальный порядок блоков в параметрах книги следующий:
image

Дизайн минималистичный
То есть отказываемся от инфографики, которая без функционала.

Цветовая гамма
Остановились на:
светло-зеленый - основной цвет;
дополнительные - на ваше усмотрение;

Стилистика
Меньше текстов, слишком длинных выпадающих списков и т.д.

Больше пиктограмм, графических решений, анимации и т.д.

Пример:
image


Вот это меню при использовании выдаст список из 12! пунктов, потому что типография может делать книги до 1200 страниц с шагом 100 страниц. Такое решение не будет удобным на мобильных устройствах и вообще не выглядит привлекательно.


Среди ваших решений есть такие:


image


это лучше, но имеет определенные недостатки:
- занимает пространство экрана, что критично для мобильных устройств

- если увеличится допустимое количество страниц - интерфейс придется переделывать


Есть вот такое решение (реализовано на сайте fozzyshop.ua):

image


экранного пространства требует меньше

любое количество, введенное в бэкенде, автоматически распределяется по бегунку


Вот такие оригинальные и интересные решения хотелось бы увидеть.
Возможно, есть какие-то идеи по анимации пиктограмм - ротации, трансформации, подсветки, тени и т.д.

Шановні пані та панове, дизайнери🙂

Дуже вдячний що ви відгукнулися на цей проект.
Переглянув усі ваши роботи і зрозумів, що мої відповіді будуть досить однотипними і що в умовах конкурсу було замало конкретики. Отже, потрібно надати деякі уточнення і роз'яснення.

Компоновка
Идея рознести інтерфейс калькулятора на три екрани (етапи) досить слушна для моб. пристроїв та можливо планшетів, але для десктопів ми б хотіли забереги можливість відображати калькулятор одним екраном. Наприклад, обирати варіант відображення калькулятора у бекенді.
Можливо це питання більше до розробників, а не до дизайнерів.


Порядок блоків
Сперш клієнт обирає формат файла з якого буде друкувати книгу.
Формат файла визначає якого розміру буде книга і скільки сторінок матиме.
Потім клієнт обирає палітурку (тверду/м'яку).
І колір блоку сторінок (кольоровий, чорно-білий).

отже оптимальний порядок блоків у параметрах книги такий:
image

Дизайн мінімалістичний
Тобто відмовляємось від інфографіки, що без функціоналу.

Кольорова гама
Зупинились на:
світло-зелений - основний колір;
додаткові - на ваш розсуд;

Стилістика
Менше текстів, занадто довгих випадаючих списків, тощо.

Більше піктограм, графічних рішень, анімації, тощо.

Приклад:
image


Ось це меню при використанні видасть список із 12! пунктів, бо друкарня может робити книги до 1200 сторінок із шагом 100 сторінок. Таке рішення не буде зручним на моб. пристрої та і взагалі не виглядає привабливо.


Серед ваших рішень є такі:


image


це краще, але має певні недоліки:
- забирає простір екрану, що є критичним для моб. пристроїв

- якщо збільшиться допустима кількість сторінок - інтерфейс прийдеться переверстувати


Є ось таке рішення (реалізовано на сайті fozzyshop.ua):

image


екранного простіру потребує менше

люба кількість, введена в бекенді, автоматично розподіляється по бігунку


Отакі оригінальні і цікаві рішення хотілося б побачити.
Можливо є якісь ідеі що до анімації піктограм - ротації, трансформації, підсвітки, тіні, тощо.


Обновление #2 от 20 марта 2023, 13:56

Также не было объяснения по поводу дополнительных услуг:
Поиск файла
Стоимость файла

Уже сейчас количество дополнительных услуг увеличилось, поэтому эту опцию также нужно сделать масштабируемой.
то есть у нас есть пиктограмма "Дополнительные услуги", клик по ней открывает поп-ап с перечнем дополнительных услуг.
Перечень лучше сделать в виде пиктограмм с всплывающим объяснением, чем в виде текстового описания.

Також не було пояснення щодо додаткових послуг:
Пошук файлу
Вартість файлу

Вже зараз кількість додаткових послуг збільшилась, тому цю опцію також потрібно зробити маштабуємою.
тобто маємо піктограму "Додаткові послуги", клік по ній відкриває поп-ап із переліком додаткових послуг.
Перелік краще зробити у вигляді піктограм с спливаючим поясненням ніж у вигляді текстового опису.


Обновление #3 от 20 марта 2023, 14:29

Уважаемые, извините, что не предупредил раньше, но обращаю внимание, что, хотя на примере в Figma язык интерфейса русский,
язык конкурсного интерфейса - украинский

Шановні, вибачте що не попередив раніше, але звертаю увагу, що, хоча на прикладі у Figma мова інтерфейсу російська,
мова конкурсного інтерфейсу - українська


Обновление #4 от 20 марта 2023, 18:31

Система оценки:
5 звезд - победитель
4 звезды - кандидаты на победителя
собственный дизайн (иконки, шрифты, анимации), учтены все пожелания описания к конкурсу
3 звезды - неплохие (2-3 недостатка) рекомпозиции базового (нашего) дизайна или собственного
2 звезды - попытки рекомпозиции базового дизайна или даже собственного с более чем 3-мя недостатками

Система оцінювання:
5 зірок - переможець
4 зірки - кандидати на переможця
власний дизайн (піктограми, шрифти, анімації), враховані всі побажання опису до конкурсу
3 зірки - непогані (2-3 недоліки) рекомпозиції базового (нашого) дизайну або власного
2 зірки - спроби рекомпозиції базового дизайну або навіть власного із більш ніж 3-ма недоліками


Обновление #5 от 22 марта 2023, 14:00

Уважаемые, в процессе работы над калькулятором нашли интересную, на наш взгляд, идею компоновки интерфейса, поэтому дальше будут рассматриваться только работы на основе этого макета


image




Шановні, у процесі роботи над калькулятором знайшли цікаву, на наш погляд, ідею компоновки інтерфейсу, тому далі розглядатимуться тільки роботи на базі цього макета


image





Обновление #6 от 22 марта 2023, 14:15

Цвет для основного тона темы, используйте, пожалуйста, этот
#AEC670

Колір для основного тону теми, використовуйте, будь ласка, цей
#AEC670

Победившая работа Kateryna Perchun

Обрали Катерину переможцем, бо її підхід був, на наш погляд, самий креативний і найбільш співпадав із нашим баченням.