Stories and Design

Types of Users

1. Visitor
2. Administrator

Key Stories & Acceptance Criteria

Navigation Bar
A visitor can access the navigation bar at the top of each web page. The navigation bar has the website logo and the main menu button. The logo links to the landing page. The main menu button expands a dropdown on the right hand side that contains a list of links to all other web pages. While a visitor operates on the main menu dropdown, the background freezes.

Effects Button
When a visitor is on the gallery page, an additional “effects button” appears on the navigation bar. Similar to the main menu, it opens a dropdown menu on the right hand side of the web page. The menu contains buttons that can change the display options and filtering of the photos on the gallery page.

Slideshow View
The landing page shows the featured photos in a slideshow display. A visitor can click on the arrows on the slideshow to skip forward or backward.

List View
The gallery page shows all or selected photos in a list display. When a visitor hovers over a photo, the photo is highlighted. Each photo can be clicked to expand into a full screen view and dragged to rearrange its position in the list.

Django Server
An administrator can login to the Django admin site to upload, delete and tag/untag photos.

Navigation Diagram, Wireframes & Mockup

Link to Google Drive