#maz publishing

[mazdigital-blog]

ExecProtec Magazine created an awesome video to explain all aspects of their digital magazine. Available on both iOS & Android devices from iTunes & Google Play app stores!

[mazdigital-blog]

How to Shine in Cupertino

How does Apple choose what apps to feature in their store? While it certainly comes from high downloads, positive ratings and good press, these numbers don’t just show up overnight. They can only happen if people know about your app and like it enough to spread the word. How do you create an app like that? Give users a reason to keep coming back.

Newness Factor:

Each time a user launches your app, it should have something new to offer that wasn’t there before. Think of your app like a social networking site that you refresh to find something new.  Magazines, for example, generally publish their content monthly, or weekly at best. Imagine if magazines pushed out new content more frequently; users would be launching the app multiple times a day to read what’s new. Free trials, previews, and incorporating all your social networking sites into your app can be useful tools to showcase such content, and engage users new and old alike, as seen below in our storefront.

Point of Difference:

Another important reason for a user to return to your app is what I call its “point of difference.” What makes your app stand out from all other apps? Besides basic functionality, figure out what that extra oomph to the user experience could be. Whether it’s amazing graphics, especially fast and fluid performance, or a novel feature unique to your app, this distinguisher is key. A feature unique to our apps is Stream, demonstrated below, it is a visual archive from both the publication and reader of shared and saved content in app and from the web.

While in a perfect world, I would be able to simply say, “Follow these steps and your app will be one of the best on the App Store” -- I know it is easier said than done. But to me, these are truly the most important considerations an app developer can do to draw more downloads and keep users coming back for more.

Areeb Ahmad is Director of Quality Assurance in Noida, India. Follow him on Twitter @areebahmad.

[mazdigital-blog]

Re-Designing Hundreds of Apps for iOS 7

I remember the exact moment it hit me– we had gathered couches in the office to watch the WWDC Keynote like it was a movie, and as they unveiled the iOS 7 video segment, it became immediately clear: we were going to have to redesign everything.

Like many app designers that day, I was feeling incredibly inspired after that Keynote and immediately got right to work.

We had already been planning on a UI overhaul of the Store section of our apps, and so now I had a really good excuse to do exactly that.

The tricky part was (and always is) that the app I was designing was actually a template for hundreds of apps that use MAZ to publish onto iOS, and so while I wanted to be on the bleeding edge design-wise, it still had to be vanilla enough to look good with all the types of content we help publish.

I'll give away the ending of the story here, but these are our new iOS 7 designs for iPad and iPhone:

Here is a journey through the process:

iOS 5

Version 2.6 of the MAZ Publishing platform marked the last major update of our apps' UI, which was back in February of 2012. We launched v2.6 with the premier of Inc. Magazine for iPad. This marked an important transition as we added a web button and a Twitter button in the Store section of our apps, allowing users to visit websites in the Store. Prior to that users could only purchase/download content to view it - this was the first move toward offering free web-based content inside the apps as well.

(look at the RSS and Twitter icons toward the top right)

iOS 6

A year and a half later, we released MAZ Publishing 3.6, which looked like this:

Same general concept but with some tweaks. There had actually been five updates to our apps between v2.6 and v3.6, culminating in this modern and polished UI, but one clearly built for iOS 6.

Concepts for a New Storefront

Soon after v3.0, which was April 2013, well before iOS 7 was announced, I was already working on some concepts for a brand new Store UI. My basic goals were to: - give a fresh new look to the apps - emphasize new content - give even more access to web content - not stray too far from our current layout so we wouldn't need to re-process all the assets on our servers - make Clippings more prominent (trivia: Clippings was introduced in MAZ Publishing 2.8)

My first design was one which in retrospect is actually pretty iOS 7-y with it's bright colors and white background, even though I didn't know about iOS 7 yet!

I took our "full cover view" and made it the default view, instead of "grid view" which had always been our default previously, so that the newest cover would be the main event when a user launched the app, instead of many small thumbnails with none weighted over the others.

I added a Clippings Button to the right of the cover so that a user could very easily create a clipping of the cover.

I also introduced more social buttons so that the user could load any of that web-based content right inside the Store. I borrowed from our iPhone UI which had a sliding drawer and applied it to iPad.

This was the birth of the "hub" idea which is now a cornerstone of MAZ Publishing - basically that a publisher's app should be much more than the converted print product - it should be a one-stop-shop for all content, including web, social, etc.

I killed content descriptions since the content was big enough to be legible (as opposed to the thumbnails), and most descriptions were redundant with what was already designed into the cover.

Another thing I brought to the new Store was the draggable overlay that we were already using within our content Reader, instead of a full-page web view inside a UITableView as we had previously done for web content accessed through the Store.

Now when a user tapped on one of those buttons along the left, the site would open in a draggable overlay like this:

Initial Concepts for iOS 7

The very day of the WWDC Keynote, after catching a glimpse of iOS 7, I got to work on updating my designs. Ironically, I didn't really think I had that much to do.

First, I changed the fonts and toned down the gradients of the buttons. Then I changed the drawer background color to light grey to make the whole thing feel airier.

I thought I was done!

Of course, a lot of my initial impressions of iOS 7 were incorrect - my buttons were wrong, there should be no separation between nav bar and status bar, and as it turned out, going lighter was the wrong move...

Seeing is Believing

Even though I was still tweaking buttons, colors, and fonts, the new Store UI was actually already well underway with our dev team at the time of the WWDC announcements.

Soon enough, I had a live build to run on my iPad. I thought it was going to blow me away (after all, it was my own design come to life, how could I not love it?), but the truth is, I didn't really like it as much as I thought I would.

It didn't really make sense– I had really seen it a million times as I worked on it, had previewed it on the actual devices (Skala Preview is the greatest invention in the world) and simulated interaction (I use Keynote for all my prototypes and even most of my final design work - builds/transitions = fast prototyping), but using the actual real app is just different. And it wasn't good enough.

Not to mention, my initial attempts at updating to match iOS 7 weren't actually right. Once I had time to read through the new iOS Human Interface Guidelines and actually use iOS 7 firsthand, I realized that there was a lot more work to be done.

Buttons Without Buttons

For the purchase/preview/download buttons, I toyed with various arrangements, but came to find that the new iOS 7 button-less button (i.e. only text) would work well. I made the colors of the text to match the colors our users were accustomed to. Green to buy, blue to read, and so on.

I also used the fact that we were dealing with pure text to add some more descriptive language to the buttons.

I couldn't really do all the buttons as text-only because they would all be competing for attention. So for the subscription buttons, I added a simple thin border, and slightly emphasized free trials with a lighter blue.

Back to Black

Okay, well not black, but dark blue. One problem when I was using the live build of the new Store was that the covers were being drowned out by the pure whiteness of the background. Sort of like in the new Photos app for iOS 7, your eyes don't know where to focus when the pics are against the white, and really pop against the black (especially when using a black device where the black screen/black hardware border is ambiguous).

Here is a version of the UI that is very close to the final version, in light grey and in dark blue.

See how much more the cover pops out on to the dark background? Our v3.6 design for iOS 6 had a subtle dark blue gradient, and so I decided to backtrack to that palette, but without a gradient.

I removed all the drop shadows, even on iPhone behind the drawer. We also added some gesture based navigation, like swiping back to the Store from the Reader instead of needing to tap the back button.

For the navigation bar icons, I made some modifications to our buttons to make them a bit larger, more geometric - I made them solid white with no drop shadows, and generally made them look cleaner.

Similarly, for the interactive buttons inside the content, we flattened all of them and made them feel lighter.

Here are a bunch of other side-by-side comparisons between our iOS 6 iPhone design and iOS 7 (two different apps but you get the idea).

So that's the story! It was a long process, but I believe we landed on the right final product. Submitting those hundreds of app updates was no fun, but that is a story for another post another time...

To send you off, here is a classy animated GIF of the various iterations of our iOS 7 design. I recommend listening to a Justin Bieber song while you watch.

Paul Canetti is one of the founders and CEO as well as lead UX/UI designer at MAZ. He tweets about publishing, design, and media at @paulcanetti and teaches at General Assembly in physical reality.

[mazdigital-blog]

Introducing MAZ Publishing 4.0

We are extremely excited to announce the release of MAZ Publishing 4.0, our fourth major release and the most ambitious one yet.

Not coincidentally, this update follows on the heels of Apple's iOS 7, and MP 4.0 is a total reimagining of our iOS apps.

We also took it as an opportunity to rethink the platform as a whole. There are updates for Android on Google Play and Amazon's Appstore, plus powerful new marketing and design tools in MAZ Control.

iOS 7 Design

The most striking difference in our new iOS apps is a total overhaul of the UI (user interface) that we had been using for the last three years. Our new iOS apps are cleaner, flatter, and more subtle, allowing the content to really pop.

Web & Social Content in the Store

Inspired by the use of web buttons inside the content our publishers create with MAZ, we now have web and social media buttons right in the Store- where users can access them as soon as they open the app.

Featured Web Content

Users can now see the publisher's latest news or promotions as soon as they open the app. Regardless of scheduled frequency of the publication, Featured Web Content allows any publisher to update their app with new content whenever they would like.

Custom Push Notifications

Push notifications can now be sent on the fly and say whatever you want, instead of only coinciding with new content going live. There is no better way to provide value to users than by providing them with important news as it happens, even if they are not in the app.

Used in conjunction with Featured Web Content, push notifications can alert users to specific content and breaking news, and when they open the app that content will already be queued up. Push notifications now work with Google Play apps as well.

Clippings Buttons

Clippings has become a staple of MAZ apps. 1 out of every 5 times someone downloads content, they create a clip. Each clip has a Clippings Link attached to it, which refers traffic back to the app or to the publisher's website.

We have now introduced a Clippings button right in the Store and on every website, so it is easier than ever for users to spread the word across social media.

Indicators

Users do not always understand how to take advantage of the amazing features available to them when reading on a mobile or tablet device. Now these simple prompts can be placed anywhere on the page to help educate users about how to best navigate and use their apps.

New Design Tools

We have added grid lines and zooming to the Design Tab of MAZ Control. Now you can have even more control and precision as you lay out interactive elements on the page.

The Organize Tab now displays page numbers in real time as you make adjustments and shows you what page you currently have selected.

Visual Page Linking

It is now easier than ever to link from page to page. Instead of needing to know the exact page number, you can simply select the thumbnail of the page you want to link to.

Our Best Release Ever

We've been hard at work building these improvements over the last few months, and MAZ Publishing 4.0 is by far the best version of the platform we've ever had.

Check it out now.

We hope you enjoy using it as much as we enjoyed making it!

-The MAZ Team