Салют👋, нижче прописане ПОВНЕ технічне завдання проєкту. Якщо ти зможеш виконати його — ласкаво прошу з питаннями та пропозиціями. Якщо знаєш того хто зможе це зроюити, також ласкаво прошу)
1. Загальна інформація
• Мета проекту: Створити комерційний шаблон Google Таблиць для фінансового контролю, який має вигляд професійного інструменту з привабливим дизайном.
• Користувачі: Бізнес-клієнти та користувачі, які потребують зручний та зрозумілий інтерфейс для управління фінансами.
2. Задачі
• Розробка фірмового стилю.
• Дизайн кнопок і основних елементів інтерфейсу.
• Розробка логотипа для шаблону
• Додавання додаткових декоративних елементів для покращення візуального сприйняття.
3. Основні вимоги
• Естетика: Оформлення має виглядати сучасно, професійно та зручно для користувача.
Приклади:
• Кольорова гама: Використання гармонійної палітри кольорів, що відповідає загальному фірмовому стилю.
Приклад кольорів, які подобаються:
• Інтерфейс: Мінімалістичний, але інформативний дизайн, який дозволяє легко орієнтуватися серед даних.
• Шрифти: Легкі для читання, з перевагою до сучасних та простих шрифтів
Приклад:
4. Елементи дизайну
• Кнопки: Створення стилізованих кнопок (з кольоровим маркуванням для різних дій, наприклад, “Дохід”, “Витрата”, “Переказ”).
• Іконки: Додавання іконок для різних категорій або функцій (наприклад, категорій транзакцій).
• Структура таблиці: Оформлення заголовків колонок, виділення важливих даних (сум, дат тощо).
• Навігація: Оптимізована для легкого переходу між сторінками/таблицями.
5. Додаткові елементи
• Логотип: Логотип, який буде розміщений у верхньому куті або як водяний знак (за потреби).
• Візуальні акценти: Створення елементів, які допоможуть виділити ключові дані або підказки для користувача.
6. Інтеграція
• Інтеграція стилю та елементів напряму у Google Таблиці, щоб шаблон був готовий до використання після естетичного доопрацювання.
7. Терміни
• Попередній перегляд дизайну: 3 днів після затвердження ТЗ.
• Повна інтеграція та фіналізація: до 5 днів.
8. Вимоги до здачі
• Кінцевий продукт у форматі Google Таблиць, готовий до тестування.
• Презентація фінального дизайну у вигляді макетів або скріншотів з поясненням ключових елементів.
9. По кожному аркушу окремо та по таблиці в цілому
До всіх аркушів:
На кожному аркуші є різні зони, або окремі клітинки, які користувач може редагувати.
Потрібно таке дизайнерське рішення, щоб місця для редагування були однаково оформлені, щоб користувач на підсвідомому рівні розумів що можна редагувати, а що ні.
Назва дії кнопки має розміщуватись на самій кнопці
Логотип у верхньому лівому куті
Інформаційна панель:
Приклад оформлення на аркуші “Приклад 1”. Приклад не є точним побажанням, а лише загальним відображенням головної ідеї.
В середину об’єднаних клітинок вставляється зображення. Шрифт назв рахунків має бути компактним.
Важливе уточнення: дані у інформаційній панелі, та там де платежі, будуть динамічно змінюватись. Тобто їх може ставати більше, або менше. Тому потрібно таке рішення, яке буде гармонійно виглядати з різною кількістю даних (від 20 до 30 рядків).
Кольорове виділення рядків
згідно значенню в стовпці "Підтвердження" і даті в стовпці "Дата".
значення "Скасовано" - потрібно щоб не привертало увагу
значення "Очікує", дата < сьогодні - перша терміновість, має максимально привертати увагу
значення "Очікує", дата = сьогодні - друга терміновість, має потрапляти на очі, але не сильно навантажувати
значення "Очікує", дата > сьогодні - не терміново
Кольори мають інтуїтивно пояснювати терміновість платежу.
Аркуш 1 - “Платежі”
Зліва - інформаційна панель
У верхній частині розташовані кнопки: “Дохід”, “Витрата”, “Переказ”, трохи в стороні “Видалити”
Кольорове виділення рядків
На цьому аркуші користувач може редагувати тільки інформацію по платежам та взаємодіяти з кнопками.
Редагувати можна починаючи з рядка №10, наступні стовпці: "Дата", "Рахунок", "Контрагент", "Сума", "Пдтвердження", "Категорія", "Коментар"
Важливе уточнення: кількість платежів - динамічне значення
Аркуш 2 - “Фільтр”
Зліва - інформаційна панель
У верхній частині розташована кнопка: “Фільтр”
Кольорове виділення рядків
На цьому аркуші користувач може редагувати тільки клітинки, які зараз виділені жовтим кольором
Важливе уточнення: кількість платежів - динамічне значення
Аркуш 3 - “Контрагенти”
Зліва - інформаційна панель
У верхній частині розташовані кнопки: “Новий контрагент”, “Нові реквізити”, “Змінити назву”
На цьому аркуші можна редагувати починаючи з рядка №10, всі стовпці, окрім “№” та “Назва контрагента”
Важливе уточнення: кількість контрагентів та кількість рахунків - динамічне значення
Аркуш 4 - “Мої рахунки”
Зліва - кнопки: “Новий”, “Редагувати”, “Видалити”
Нижче кнопок комірка (виділена жовтим) для редагування назви компанії користувача
Важливе уточнення: рахунки можуть додаватися нові, відповідно таблиця буде розширюватись праворуч
Аркуш 5 - “Категорії”
Зліва - кнопки для взаємодії з категоріями
Важливе уточнення: категорії і групи категорій можуть збільшуватись як праворуч так і вниз. Є можливість зробити умовне форматування рядка, який містить невидимий символ. Наприклад, між “Доходами” та “Витратами”
Аркуш 6 - “Рахунок-фактура”
Багато клітинок доступних для редагування (виділені жовтим)
Чотири кнопки: “Додати рядок”, “Прибрати рядок”, “Оновити”, “Сформувати рахунок”
Аркуш має мати структуру схожу на рахунок-фактуру
Важливе уточнення: кількість товарів у рахунку фактурі може змінюватись
HTML форми
Майже кожна кнопка у таблиці відкриває HTML форму для виконання відповідної дії. Форми мають зберегти всі присутні функції, але дизайн форм має повністю відповідати фірмовому стилю
Behance