Розробити дизайн інтерфейсу сайту

Сайт: https://ico.dropthebomb.io

Опис проекту:  набір мікрозавдань та можливість їх виконувати для учасників.

Завдання: на прикладі сторінки в додатку розробити адаптивний інтуїтивний дизайн для користувачів.

Для оцінки можна надати image файл у хорошій якості. Після вибору переможця необхідно надати підсумок у Zeplin, виконаний під верстку.

Колірна гамма, схожа на цю на скріншоті (можуть трохи відрізнятися тони). Можливе додавання 1-2 нових (без строкатості та кольорових надмірностей) і інше використання кольорів.  Логотип можливо підлаштувати під загальний стиль.

Особливу увагу приділити шрифтам, зараз шрифти сильно відрізняються і не завжди читабельні.

Моменти, які потрібно підкреслити та виділити:

1) На всіх сторінках повинно відображатися ім'я користувача та його ID. 

2) при наведенні на ім'я користувача випадає меню - потрібно показати, що там є меню і відобразити саме спливаюче меню (3 пункти).

3) При вході нового користувача він повинен бачити посилання-призив "Пройдіть 1ий квест" (можна замінити на аналогічну за змістом напис),  виконане так, щоб користувач звернув на неї увагу.

4) Порой у  розділі Лента (перший пункт меню під логотипом) з'являються нові повідомлення для користувача,  необхідно показати, що прийшли нові повідомлення (знаком/анимацією/якось інакше)

5)  Учасник/Поточні/Найближчі - це фільтри, на основі яких виводиться інформація під ними. За замовчуванням Поточні.  Потрібно оформити їх так, щоб було зрозуміло, що вони впливають на інформацію внизу, ну і звичайно відображаючи, який з фільтрів обрано. Можливо оформити у вигляді табів (а-ля Excel, Google sheets)

6) При наведенні на рядок - проект, рядок повинна виділятися. На прикладі виділений і натиснутий проект DropTheBomb.

7) Усі кнопки повинні бути зрозумілі, як кнопки. При наведенні повинні реагувати.

8) соціальні посилання (в кружках зліва) повинні бути виконані в відповідній кольоровій гамі (а не як на скріншоті)

9) випадаючі меню повинні бути гармонійні.

10) на самій сторінці Проекти зверху (на скріншоті до фільтрів Учасник/Поточні/Найближчі) повинно бути опис розділу однією фразою. Наприклад, "Тут ви можете переглядати свої поточні проекти, а також розглядати і приєднуватися до нових."

11) Нижня частина сторінки повинна бути вже, ніж є, щоб не кидатися в очі.

12) Список завдань у конкретному проекті повинен бути ближче до самої рядка проекту, на яку клікнули. Зараз знаходиться дуже низько.

13) У п'ятій колонці повинен відображатися значок, по натисканню на який спливає вікно з поясненням до завдання. Потрібно значок зробити під дизайн, так щоб було зрозуміло, що це пояснення і відобразити це вікно з текстом підказкою. Приклад пояснення:

"Для виконання завдання потрібно:

• - натиснути виконати
• - вступити в групу
• - натиснути перевірити"

14) Потрібно відобразити значок/іконку/кнопку для закриття списку завдань по поточному проекту і поверненню до загального списку проектів.

15) Напис "Залишилось місць 803" під логіном можна прибрати.

16) Усі логічні вирівнювання повинні бути дотримані.

17) закруглення кнопок, полів, текстових рядків (де необхідно) повинні бути виконані.

18) Усі меню, посилання, кнопки повинні бути зрозумілі і при наведенні змінюватися, для акценту на цьому полі.

Сайт: https://ico.dropthebomb.io

Описание проекта:  набор микрозаданий и возможность их выполнять для участников.

Задача: на примере страницы в приложении разработать адаптивный интуитивный дизайн для пользователей.

Для оценки можно предоставить image файл в хорошем качестве. После выбора победителя необходимо предоставить итог в Zeplin, выполненный под верстку.

Цветовая гамма, схожая с данной на скриншоте(могут немного разнится тона). Возможно добавление 1-2 новых(без пестроты и цветовых излишеств) и иное использование цветов.  Логотип возможно подстроить под общий стиль.

Особое внимание уделить шрифтам, сейчас шрифты сильно разнятся и не всегда читаемы.

Моменты которые нужно подчеркнуть и выделить:

1) На всех страницах должно отображаться имя пользователя и его ID. 

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

3) При входе нового пользователя он должен видеть ссылку-призыв "Пройдите 1ый квест"(можно заменить на аналогичную по смыслу надпись),  выполненную так, чтобы пользователь обратил на нее внимание.

4) Порой в  разделе Лента(первый пункт меню под логотипом) появляются новые сообщения для пользователя,  необходимо показать, что пришли новые сообщения (знаком/анимацией/как либо иначе)

5)  Участник/Текущие/Предстоящие - это фильтры на основании которых выводится информация под ними. По-умолчанию Текущие. Нужно оформить их так, чтобы было ясно что они влияют на ифнормацию внизу, ну и конечно отображая какой из фильтров выбран. Возможно оформить в виде табов (а-ля Excel, Google sheets)

6) При наведении на строчку- проект, стрчока должна выделятся. На примере выделен и нажат проект DropTheBomb.

7) Все кнопки должны быть понятны, как кнопки. При наведении должны реагировать.

8) социальные ссылки(в кружках слева) должны быть выполнены в соответствующей цветовой гамме(а не как на скриншоте)

9) выпадающие меню должны быть гармоничны.

10) на самой странице Проекты сверху(на скриншоте до фильтров Участник/Текущие/Предстоящие) должно быть описание раздела одной фразой. Например, "Здесь вы можете просматривать свои текущие проекты, а также рассматривать и присоединяться к новым."

11) Bottom страницы должен быть уже чем есть, чтобы не бросаться в глаза.

12) Список задач в конкретном проекте должен быть ближе к самой строке проекта на которую кликнули. Сейчас находится очень низко.

13) В пятой колонке должен отображаться значок, по нажатию на который всплывает окно с пояснением к задаче. Нужно значок сделать под дизайн, так чтобы было понятно что это пояснение и отобразить это окно с текстом подсказкой. Пример пояснения:

"Для выполнения задания нужно:

• - нажать выполнить
• - вступить в группу
• - нажать проверить"

14) Нужно отобразить значок/иконку/кнопку для закрытия списка задач по текущему проекту и возвращениию к общему списку проектов.

15) Надпись "Остлось мест 803" под логином можно убрать.

16) Все логичные выравнивания должны быть соблюдены.

17) закругления кнопок, полей, текстовых строк(где необходимо) должны быть выполнены.

18) Все меню, ссылки, кнопки должны быть понятны и при наведении меняться, для акцента на этом поле.