Разработка графического

пользовательского интерфейса

Выполнила студентка группы ПОС-10б

Лысакова Наталья

Стартовая страница сайта

Модель GUI Studio Design

Описание стартовой страницы сайта

• На главной странице изображено две кнопки «Авторизация» и «Регистрация»

• Если у пользователя уже есть логин и пароль, то он нажимает кнопку «Авторизация» и переходит на форму вода логина и пароля.

• Если пользователь еще ни разу не пользовался сайтом, то он нажимает на кнопку «Регистрация» и переходит на страницу регистрации.

Страница регистрации

Модель GUI Studio Design

Описание страницы регистрации

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

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

• После нажатия на кнопку «Зарегистрироваться», в случае если все данные верны, пользователь получает сообщение с подтверждением регистрации и ссылку на страницу авторизации для ввода логина и пароля.

Страница авторизации

Модель GUI Studio Design

Описание страницы авторизации

• На странице авторизации пользователь вводит свой логин и пароль для входа в систему.

• Если авторизация прошла успешно, то пользователь перенаправляется на страницу со своим игровым полем.

Игровое поле: дополнительные фреймы

Выход из системы

Игровое поле: навигация

Модель GUI Studio Design

Описание игрового поля

• Игровое поле состоит из нескольких частей: поле, карман и сундук.

• При нажатии кнопки «Карман» поверх рабочего поля появляется слой, содержащий плитки, которые пользователь поместил туда.

• При нажатии кнопки «Сундук» поверх рабочего поля появляется слой, содержащий плитки, которые пользователь поместил туда на длительное хранение.

• По нажатию кнопки «Выход» происходит выход из системы и для повторного её использования необходимо авторизоваться заново.

• Плитки на поле группируются в зависимости от категории и имеют общий цвет рамки.

• При клике на плитку открывается связанная с ней ссылка, либо файл.

Спасибо за внимание