HTML Forms – we’ll go over the elements to make an html form for text inputs, radio buttons, checkboxes and dropdowns. This is the foundation of a user interaction interface.

Assignments:

Make a well designed form for any topic you would like. Use any html/css features you need to create the well-designed form. Consider the data you would like to collect from the user. Use each of the form elements we discussed at least once in your form. The page you create with the form should include an intro and some explanatory text. Develop it in Bootstrap, putting it in the sample project from yesterday, in the larger of the two uneven columns.

Work on your Project 1 Interactive Quiz. Develop an appropriate scoring method and any other interactivity you’d like to demonstrate in the Quiz. This can be a quiz that calculates or scores correct answers or it can be a Buzzfeed-style quiz where you provide different results based on the answers. Put some thought into the scoring and interactivity. Add any design elements to make this a well designed quiz. Upload this to a new subdomain.

Assignments:

Review the More Interactive Examples (no video for this, just reference and code) tutorial on CodeActually.com. You will want to take a close look at the Buzzfeed Quiz examples, if you are doing a project of this nature.

Work on Interactive Quiz Project. Be ready to finish it in class on Monday.

Week 2 – More Advanced Programming

July 17

More Interactive Examples – some of these techniques may help you with your Interactive Quiz project.

Research Assignment – find three professional data journalism projects and assess on storytelling, design and data. Write a paragraph or more on each project and then discuss how you will implement these best practices into your final project. You can find these projects in many places, including ProPublica, NY Times, Texas Tribune and more. You can do this in a Word document, save as a pdf and upload to the #datajournalism Slack channel. Due July 24.

Think about the type of final project you’d like to do for this class. The session will be over before we know it! You will need to find a data source that has good data and has the potential to tell a story. Write a Slack post about the type of data story you’d like to tell for the final project. Where is the data? Why is it interesting? What do you think you will find? What do you need to know to use it. This is due on Tues, July 25 in the #finaldata Slack channel.

Work on Project 2 – Interactive Charting Project – create a page that provides two interactive charts or maps and one table that filters a data set using a dropdown. Use your own data. This could contribute to the start of your final project.

Work on Data Analysis Project – take the data you pulled from the Twitter API, associated with your final project. Analyze the data for frequency of terms and users (and anything else that is interesting). Create at least two visualizations to demonstrate trends in the data and include a description of the analysis. You will submit this analysis as a Slack post in the #twitterapi channel with images you created as screenshots from a spreadsheet or other (TagCrowd.com) program. Do at least two different kinds of analysis.

Final Project – Use more advanced data concepts in an interactive presentation. Find some interesting data and figure out an interactive way to present it on a website. A story (to include text and that can include interviews, images, multimedia) should accompany. Data must be interactive (manipulate the DOM), which can include ways to sort and filter data or present it interactively with charts. Site should have both an interactive table generated by json data with form to select and an interactive chart. Site should use responsive techniques that we discussed (fluid layout, fluid images and media queries).