To Do This Week
Multimodal Projects To Do:
Your group should have at least one section or chapter of text ready for formatting next week. This does not need to be fully edited, but it should have multiple paragraphs, headers, bullet points(?), footnote(?), placeholders for image or media content. Next week we will work on CSS design for reading.
Also, discuss how you will complete the writing and copyediting on a schedule for Nov 8th publication.
Read:
- A really simple guide to visual hierarchy in web design
- Practical Typography
a web book on typography, read Typography in 10 minutes and consult other chapters as a resource - CSS Basics
if you need to brush-up
Blog Prompt: For deep and/or hyper attention, design is crucial. Design helps to focus attention and to distract with attention-grabbing elements. Based on the design readings above, how might you apply certain ideas or principles on the design of your multimodal project? Please quote from readings.
Class Notes
Multimodal Publication (small groups): 20%
DUE NOV 8th
For the Multimodal Project, you will be working in groups of 3-5 students. As a publishing team, you are to come up with a web-based publishing project that uses different media (text, image, video, animation, audio, interactive media, etc) to express, address and/or educate about a single topic. The topic could be a “how to” explanation or demonstration of skills, a collection of works of digital fiction or art that share a theme, a multimedia exploration of a moment or period of history, or an engaging resource of information around a topic. The final publication must…
- Involve the collaborative efforts of each student in the group, with planned editing workflows and responsibilities
- Address design issues around Hyper and Deep attention of readers
- Design should include a designed cover of the “book” as well as media as illustration and/or interactive demonstrations of ideas
- Take care in the quality, clarity and accessibility of text, media and web design
- Be presented in a designed web interface
- Have an about or masthead page with the roles of each student, resource, bibliography, date and other publishing information
- Be promoted through DTC Slack channels with engaging multimodal messaging
- Project Word Doc: add bullets, figures, figcaptions, blockquotes for CSS styles later
- Convert Word doc to Markdown > Aspose – word-to-md,
- Check Markdown: fix issues with headings, spacing, italics, blockquotes, etc
- Macdown > HTML
- Open project template < ZIP> in Sublime Text and paste the new HTML in the #main section (where the main chapter will go)
- Overview of template CSS stylesheet
- Identify content parts (within each chapter) of your publication – create new div ids if necessary
- How will visual hierarchy allow for deep and hyper attention? Number content parts in the hierarchy.
- CSS Grid and responsive design
- Apply CSS Styles: headings and subheadings, paragraphs, blockquotes, figures/images, lists, footer and header, menu, etc
- Typography – “rules”, use “ems”, choose font pairings, line-spacings, rhythm, difference/repetition | Summary of Rules
- Digital pagination/navigation – scroll vs cards, parts, chapters and sections
- Responsive layout, test on different devices
- Get in groups and share design ideas, select fonts and color schemes
- Share designed pages with class
Scroll effects: