Questions from the assignment
- Coding for personal designed eblast is not functioning right but I'm not sure what I did wrong. I was also struggling to get the text to fit in the circle buttons.
- I uploaded the sketch url hopefully it is right the file size was too large to add to the form.
- Can we make grids inside the grid?
- how do I get rid of the grid effect that is applied to other classes?
- Still confused about CSS like simplifying CSS. (Same Grid structure, Same Typeface but different positions)
In class discussion
- Temperature check: everyone doing okay? Questions, concerns, frustrations?
Coding review
Take notes when we review your presentation
- Lihua Jin :: Coding 1 | Coding 2 | Design (Sketch cloud URL) | Design (Sketch file) |
- Alyssa Tornese :: Coding 1 | Coding 2 | Design (Sketch cloud URL) |
- Hyeona Kim :: Coding 1 | Coding 2 | Design (Sketch cloud URL) |
- Yolaina Nicasio :: Design (Sketch cloud URL) |
- Ifah Pantitanonta :: Coding 1 | Coding 2 | Design (Sketch cloud URL) |
- Yuran Won :: Coding 1 | Coding 2 | Design (Sketch cloud URL) |
- San Yoon :: Coding 1 | Coding 2 | Design (Sketch cloud URL) |
- Day Chae :: Coding 1 | Coding 2 | Design (Sketch cloud URL) |
- Grace Oh :: Coding 1 | Coding 2 | Design (Sketch cloud URL) |
- Amina Cheng :: Coding 1 | Coding 2 | Design (Sketch cloud URL) |
Sketch Part II
- The power of sketch is the ability to override styles and symbols
- Let's download and inspect this Sketch file
In class discussion: Content inventory
- In order to redesign an existing site successfully, you need to:
- Know about all the content on the existing site
- Categorize, rename, restructure, archive, or delete each piece of content
Information Architecture: XML, RSS, & sitemap.xml
- XML is another markup language, like HTML, but specifically meant for data only
- You can think of XML as like HTML, except you're totally free to make up the names of the tags
- XML can be useful because it totally separates data from design. For example, view source of this page. This is a web design paradigm that is still popular today.
- Often XML is used to pass information from machines to machines in a human readable format. RSS (Really Simple Syndication) is a variant of XML that defines a set of tag names that will be used, universally, to distribute ("syndicate") content. With out this standard, content aggregation would not be possible.
- For an example of RSS, see Huffington Post's syndication page and click on the The Full Feed > Feed
- Similar to RSS, all of the big search engine companies (Google, Yahoo, Bing) have agreed on a standard set of XML tags to define a website's sitemap, which is generally called "sitemap" or "sitemap.xml"
- sitemap.xml is a listing of every page on a website, which is then used by a web crawler to index each page's content
- You can generate a sitemap.xml with many free online tools, such as xml-sitemaps.com
- Using that tool, generate a sitemap of http://www.mashavainblat.com
- Here is Genspace's sitemap.xml file
In class discussion: Content strategy
- Define the audience
- Define at least three target demographics for Genspace, in order of importance
- Some examples of target demographics may be: parents, high school students, middle school students, educators, mathematicians, local community, math majors, etc.
- Define the goals
- Define at least three concrete goals for the Genspace website, in order of importance
- In clear and concise language, explain why you've chosen these goals. You'll need to persuade Genspace of your choices.
- Some examples of goals may be: increase traffic to the website, increase community awareness, increase ticket sales, increase community participation, get higher caliber speakers, increase attendance at specific events, get donors, increase collaboration with other schools or institutions, increase subscription to the newsletter, increase Twitter/Facebook followers, etc. Don't just copy and paste these, think of your own...
- Define how to measure your goals
- For the goals you mentioned, define in concrete terms, how the success of those goals will be measured six months after the new content strategy has been implemented
- For example, if one of the goals was "increase traffic to the website" then you could say this goal will be achieved with a 6%–12% increase in traffic to the website.
- As a general rule when making assurances to clients, under promise and over deliver
- Define the content that needs to be produced to meet your goals
- In order of importance, list all of the types of content that will need to be produced to meet your goals
- In clear and concise language, explain why each content needs to be developed
- Examples of content types: blog posts, event pages, new poster designs, live streaming of events, tweeting, posting on Facebook, slideshows (what kind of imagery?), video content (what kind of video content?), photography of the museum, better description of ticketing prices, interactive Google map, etc.
- Define a publishing schedule
- For each content type, explain how often it will need to be updated with new or revised content
- How will the site be promoted
- Once the new content strategy is in place, how will people know about it?
- Some examples of how to promote the site may be: Social media (be specific), print advertisements, subway ads, word of mouth, direct mail campaign, email blast (to whom), advertise on Google, etc.
- Here's an example of a content strategy document from a previous class (starts on page 28)
Design Assignment
Deliverable: URL to publicly Sketch Cloud URL
- Using Sketch, create at least three different designs for Genspace's About The Lab page
- Don't be afraid to add content that doesn't exist—such as thumbnails, video, or social media links—and remove unnecessary content that does exist. And don't be afraid to look for better images!
- Remember: You are not just creating a pretty design, you must also think about and enact the most effective and engaging design solution. Think about why are you designing what you're designing?
- Don't forget that you'll also need to design the navigation and the footer—don't leave that out
- When you're done, publish your artboards to the Sketch cloud (the "Cloud" button in the upper right corner of the interface). Your artboards should be on one Sketch page.
Information Architecture Assignment
Deliverable: Publicly accessible Google Sheet
- Analyze Genspace's current content from their sitemap.xml by creating your own copy of this Google Sheet
- For each piece of content, select the appropriate Action (Keep, Combine, or Remove). Then decide a category for that piece of content
- Note that many of the pages are templated, such as
/speakers
, /tag
, and /sessions
. You do not have to look at every page, just decide what to do with that section
- For the purposes of the redesign, an emphasis should be made on simplifying the website. So only keep the pages that seem essential to Genspace's mission
Writing Assignment
Deliverable: Publicly accessible PDF
- Using the six different sections of the content strategy guide above, create a well designed client presentation of this strategy
- This should be a PDF with a introductory page that includes the title of the presentation, date, author (that'd be you), and Genspace's logo
- In clear and concise language, write out your content strategy. This should consist of the six outlined sections above.
Submitting Your Work
Due Monday, 10/29 @ 10AM
Make sure all links are publicly accessible (your grade will be lower if I cannot access your work). To make sure, open up a new private/incognito browser window and test all links before submitting. After the links have been tested, submit them to this Google Form.
Further Reading
Cool Links