Academics / College Media / innovation

Developing an iPad magazine app as a class project

Generation Overload screenshot

Editor’s Note: This is a guest post by my colleague at Eastern Illinois University, Liz Viall.

Note: Many of my comments refer to specifics of the Adobe InDesign DPS procedure to build an app. If you have questions, feel free to email me atekviall@eiu.edu

Advanced publication design students at Eastern Illinois University devoted a good part of their spring semester 2013 to the design of an iPad magazine. My colleague, Bryan Murley, brought my attention to a publication by University of Oregon journalism students, ORMagazine, in fall 2012 (see previous blog post), and I thought my advanced class of 10 students could take on that challenge. I rate it as a success and a learning experience.

Tools: Adobe InDesign DPS tools are included in our CS6 license – but be aware that often these need to be downloaded after InDesign is installed. Also, last November, Adobe was offering access to the cloud and “app making” services for $249 for a year. The department also needed to purchase an iPad, which was ordered in December and arrived in April. Students looked at other magazines using my personal iPad. In addition, there were expenses for the Apple developer license ($99) as well as a third-party app “helper” ($9.99 a month).

Content: Content for the magazine came from a spring 2013 feature writing course taught by Dan Hagan in our department. Students in my class brainstormed theme and article ideas for the magazine and consulted the feature writing students (there was a three-student overlap between the two classes) to settle on a “college in the 21st century” theme.

Production: While students in the feature writing course were engaged in writing, my students developed info graphics on the story topics, hoping to use these in the ipad magazine. These worked in several cases. In others, a student writer deviated slightly from the topic or took an angle, which did match the infographic.

Also, to eliminate some complexity, I made an executive decision to offer only one view of the magazine – either horizontal or vertical – rather than both. Students chose to work with horizontal pages.

The feature stories were turned over to the design team on March 27, giving students four weeks to design their articles or extra pages. Each student designed at least one article. The class had spent three to four weeks on lessons devoted to interactivity skills in InDesign. Often those lessons had to be repeated as they designed their ipad pages.

The simple stylebook students developed for the magazine changed several times in only four weeks. Viewing your stories on an iPad is a necessity we found. The Adobe Content Viewer allows you to view your app on a desktop, but after finally viewing it on the ipad during design, we opted to up the body text size to 16/18. It also impacted our color choices as we finally saw the destination designs.

Post-production: I acted as copy editor and app developer. Both were time consuming. Students handed their finished packaged articles in to me at the end of the semester. I dealt with many typos, videos that would not load into the app and interactivity buttons that had not been set up correctly. It took me a couple of weeks to correct/replace these items.

I then set out to build the app and submit it to Apple. Both tasks had a few roadblocks.

Building the app with Adobe has many steps – I recommend Adobe’s Step-by-Step Guide to Publishing ipad Apps with DPS, Single Edition (PDF), available from Adobe. This also includes the steps needed to enroll in the Apple developer program.

For a first-timer, this process can be draining. There are developer certificates and distribution certificates, not to mention UDIC codes. You must also generate information, icons and screenshots for the final app.

My largest headache was that the app generated by Adobe Builder, which now resided on my desktop, would not install on the department’s iPad through iTunes. In Adobe Builder, I could see that not all of the graphics were showing up in the builder screen. However, they did appear in the Adobe Content Viewer. I did many Google and Adobe forum searches looking for glitches in the installation of the app on my ipad, but could not find an answer, so I started hunting for any third-party solutions. This came in the form of AirOnApp, which advertises “escape iOS provisioning hell.” I took the app build and uploaded it to AirOnApp. I called up the site on my iPad and downloaded the build. It installed on the first try, and I was able to do a final proof of the app before submission to Apple.

Generation Overload iconApple: Review time at Apple was probably longer because our magazine included articles about gay students, guns on campus and underage drinking. Nevertheless, the only changes Apple asked for was removal of one of the screenshots used in the store because it contained a photo of a gun, deemed not appropriate for all viewers. Our app waited for review for seven days; was in review for seven days. I removed the offensive screenshot, and it was approved the next day.

Lessons learned: While our two classes accomplished this in one semester, I believe this is more of a year-long project. Fall semester could be devoted to story development, while design and other interactivity might be tackled during the second semester. Several of my students added video and audio content once they finally got the stories, but most couldn’t handle that in four weeks while they continued to tackle the DPS tools. We needed more time for the project.

Our magazine, Generation Overload, is now available for free download from the app store.