Design challenges & process

The company needed a low cost and fast solution to adapt the print content to the digital content. The project manager decided to use Mag+, a digital publishing software for Adobe InDesign users. Because of the company’s time and budget constraints, redesigning the entire digital edition wasn’t an option, so instead I used the print pdf version of the magazine and adapted to fit iPad, iPhone and Android phone and tablet screens. In this process, I designed some screens and interactions to enhance the user experience.  

The team decided the best way to display the pages of the magazine was on a vertical orientation, but the pages that had a horizontal image across the spread looked cut off.

I had the idea of creating a dual orientation screen. I added a button, “Turn to view image,” to guide the user of turning the iPad on the horizontal orientation view and be able to see the image bigger, it also allowed the user to either pan or zoom the image to see more.

I created a drop down menu for the contents with jump links. I designed different templates to fit the different iOS and Android devices. In addition, I added bookmarks to highlight special sections of the magazine.

To display videos I included a “Tap to see video” button, when tapped the video appears as full screen, on both portrait and landscape orientations.

I designed a slideshow template. When the user taps the “Tap to see slideshow” button, the slideshow appears on a popup screen.

I designed both Help and Feedback screens. Help screen is placed after the cover page in every issue of the magazine and the Feedback screen is placed after the last page. Users can write us an email by tapping the email icon.