We are practicing the process of making an interactive product and so were given the task of making a rough UI sketch for the steps for making toast. Here is one of my sketches.
On the first “Start” page I would like to have two menu systems. A primary timeline / navigation bar on the side for the entire interactive, then a secondary navigation bar for the other content like “About” and “Contact”.
Below is a simple UI Flow chart.
The home page will contain the main navigation where the use has the choice between seeing the, “about”, “help” or “interactive” pages. Selecting either will move the user to the desired screen. The toast interactive will have its own dedicated menu system where the user can see how many steps are in the process, where they are in the process and also give them the ability to see before or upcoming processes.