Кейс: дизайн сайта для прохождения психологических тестов
Задача и начало работы
На первой встрече я получила задание в виде ссылки на старый сайт и объяснения, что старый сайт был создан заказчиком самостоятельно, а теперь настало время профессионального его оформления. Если моя работа над главной страницей сайта будет аргументированной, аккуратной и понравится заказчику, то я буду разрабатывать дизайн всех остальных страниц.
Работу я начала с тщательного изучения имеющейся на старом сайте информации и ее более структурированного расположения на главной странице.
Таким образом, новое расположение информации постепенно снимает вопросы пользователей, которые заходят на эту страницу: что это? как это? какие здесь тесты? как это работает? почему это удобно? зачем вообще проходить тесты? и многие другие...
Подбор шрифтов
По моему мнению, подбор шрифта ответственное занятие. Если шрифт подобран верно, то он поможет донести идею сайта / его основную мысль. Если же шрифт не попал, то он скорее будет отвелекать.
Для данного проекта мне понравился шрифт Jost. Он есть в библиотеке шрифтов Google Fonts, лицензия позволяет его использование. Привлек он меня своей правильностью и округлостью — самое то для людей, которые интересуются психологией и пришли за ответами на волнующие их вопросы.
А для контраста и разнообразия был выбран шрифт Niconne, им написано всего одно слово — Online.
Подбор фото и цвета
Для того, чтобы определиться с заглавной фотографией я обратилась к статистике: большинство интересующихся психологией (70%) — это женщины среднего возраста.
Таким образом, если на главном экране будет фотография женщины, большая часть посетителей сайта (вернее, его посетительниц) сможет ассоциировать себя с ней.
Для поиска фото использовались фотостоки Unsplash и Pexels, так как фотоматериалов от заказчика предоставлено не было.
В результате были выбраны две фотографии, на основе которых получились три варианта первого экрана. Один — с фиолетовым цветом кнопок и акцентных элементов, два других — с оранжевым.
Оранжевый — очень яркий и энергичный цвет. Оранжевый ассоциируется со сменой времен года — а значит может олицетворять движение. Оранжевый связан со здоровьем и жизненной силой. В дизайне оранжевый привлекает внимание, но не подавляет как ,например, красный. Его часто считают более дружелюбным и гостеприимным и менее вызывающим.
Совместно с менеджером интернет агенства и заказчиком был выбран второй вариант для дальнейшей разработки.
После согласования главной страницы и одобрения моей работы, было решено перейти к остальным страницам!
Остальные страницы сайта
Страница с перечнем тестов (выбор теста)
Страница одного теста (его описание и возможность выбрать для прохождения)
Страница с вопросами теста
Страница интерпретации теста (с графическим представлением результатов теста)
Страница о проекте
Страница с видео автора проекта
Страница личного кабинета
Поп - апы входа и регистрации в личном кабинете
Заключительный этап
evgenia_180590@mail.ru
+7 (924) 304-5338
Facebook*: @evgeniabityutskaya
*Продукты компании META признаны экстримистскими в России
