Project 2: Interactive Storytelling
Look at design refinements in small groups and one-on-one.
During class, draw a Wireframe based upon design, so you can break it down into boxes to assist you in coding. Label your sections – think about it in containers, rows, and columns and using Skeleton. Additionally consider labeling headings (h1, h2, h3…), paragraphs, and images.
GIF help
- Animated GIF Help (Photoshop)
- Frames from Layers Method (Photoshop)
- Illustrator into Photoshop
- Procreate 5 Animation Assist
Cool CSS Stuff
Due Next Class
Project 2: Interactive Storytelling
- Finalize design for desktop and mobile prototype and share link to Figma or Adobe XD on #project2 Slack Channel. We will be doing User Testing with classmates on Thursday of prototype.
- Upload labeled 12-column grid Wireframe on #project2 Slack Channel. This can be done digitally or on paper.
- Decide how you want to integrate your required CSS Animation or Transition.