After sketching a few ideas, one can take these rough sketches to the next level with wireframes. This is a great way to explore more ideas, yet not commit yourself to a high-fidelity design. I created this wireframe in Adobe InDesign because that program is quick and easy to use (for me) and has all the functionality one needs to create a wireframe.
Wireframes are a good middle step between touch sketched and a high-fidelity mock up.
The final step of the design phase included mocking up the page in Photoshop. Granted, the interaction and motion of the elements cannot be simulated in Photoshop. But a developer could work from this mockup with accompanying annotations and notes and discussion.
The final mock up of the History page
Jennifer Blatz explores the world of UX through words and imagery
