Showing posts with label background image. Show all posts
Showing posts with label background image. Show all posts

Friday, April 26, 2013

Home, Sweet Home Screens - Three Options for Your App

As with all of our updates and development, we wanted version 2.0 of the mobile suite to address requests from our partners.  One such request has been for InstantEncore to provide different options for the Home screen, which is the first content area encountered when the app or mobile website launches.  In response to this request, InstantEncore now offers three Home screen options for your mobile app and website.

Icons ex: Berkeley Repertory Theatre

Icons

The Icons option provides a 3 x 3 table of graphics representing tabs or content areas within the app.  
  • This table of icons provides one-touch access to nine tabs in your app.  
  • If you have more than nine tabs, the bottom-right position will contain an ellipsis with the word "More" underneath.  (See example on right.) When you tap the ellipsis icon, you will see a page listing all of the remaining tabs in your app.
  • You may choose your icons from our library of graphics, or you may upload your own.  Custom icons should be sized to 60p X 60p and uploaded as PNG files with a transparent background.
  • In addition to providing navigation at-a-glance, the Icons option gives the greatest visibility to your custom background image.
Slideshow ex: Chattanooga
Symphony & Opera

Slideshow

For those who prefer a more graphically-focused Home screen, the Slideshow option allows you to create a series of full-screen slides connected to content within your app.
  • Each slide contains an uploaded image with descriptive text overlaid in the upper left corner and a call-to-action overlaid in the lower right corner.
  • We recommend uploading a 1024p X 768p image so that it appears vibrantly on tablets as well as smartphones.
  • You may use HTML markup tags to modify the descriptive and call-to-action text.
  • The call-to-action text may be linked directly to content within the app.
  • Slides may be added or deleted at any time.  Also, their order may be changed at will.
  • Slides may be loaded and scheduled in advance for seamless transitions throughout your season.
What's New ex: The Royal Conservatory

What's New

If you prefer an update-focused Home screen or you simply like the look and features of our original Home screen, then the What's New option is for you.
  • This option features a "welcome message" area at the top with a thumbnail image and 90 characters of text that can be linked directly to content within your app.
  • The second area features an upcoming event.  This may default to the next immediate event on our calendar, or you may decide to feature a particular event or no event at all.
  • The third area highlights the most recent content from the Buzz, Music and Video areas of the control panel.  As new content is added to these areas, that content will automatically appear in the What's New feed on the Home screen.

Don't Want to Choose Just One?  You Don't Have To!

Remember, the Home screen is just the first content screen that your visitors see when they open the mobile app or website.  If you like more than one of these options, you can choose one for the first position and use either or both of the others as tabs within your app.

For a step-by-step look at how to set up your Home screen, check out this tutorial video.

Sunday, April 14, 2013

New Series of Tutorial Videos for Making the Most of Your Mobile App

With the release of version 2.0 of the InstantEncore mobile suite, we have created a series of short, tutorial videos to guide you through particular tasks and content areas in the control panel.  You may view all of the videos as a YouTube playlist or individually, as follows:

The Basics

Tuesday, April 2, 2013

Rejuvenate Your App This Spring with Version 2.0

Spring is here!  Throughout the winter, the InstantEncore team has been working intently on the next generation of our mobile suite.  And now, we are excited to spring forward with Version 2.0!

Here is a quick glimpse at some of the changes we've made:

Version 2.0 displays a uniform
presentation across all platforms
Fresh, Consistent Look
Version 2.0 has a new look that appears uniformly across all three platforms:  mobile website, Android app, and iOS app.  No matter which mobile platform they are using, your app users will have a consistent aesthetic experience.

New Home Screen Options
Version 2.0 has three options for your app's home screen:  Icons, Slideshow, and What's New.
  • The Icons screen displays a 3 x 3 grid of icons connecting to various tabs in the app, which provides clear and concise navigation for app users.  If you have 10 or more tabs in your app, the last icon in the grid will be an ellipsis (...) with the word "More" underneath.  The More icon leads to a list of the remaining tabs.
  • The Slideshow screen displays a series of full-screen images with a title/description in the upper left corner and a call-to-action area in the bottom right.  The user taps the call-to-action area to go to the content in the app and swipes horizontally to move from one slide to the next.
  • The What's New screen is the same great home screen option from version 1.0 with a welcome message, featured event, and dynamic content stream drawn from the Music, Videos and Buzz areas of the control panel.

Can't choose? No problem.  You can select one to be the home screen and use the others as the 2nd and 3rd tabs in your app.  Use as many as you like in whatever order you prefer.  It's all about what works best for you and your audience.

Productions Tab
Productions Tab
In the previous version of the app, each individual event was displayed in chronological order on the Events tab.  With version 2.0, you also have the option to use the Productions tab, which groups multi-day events together in the app's list of events.  When a user taps on the production, they then have the ability to select a specific date for further information, links to online ticketing, etc.  The Productions tab allows theatres, opera companies, presenters, and other performing arts organizations to display their seasons in a manner that is more easily scanned by their app users.

Tablet Version
Your mobile apps look better than ever on iPads and Android tablets.  Version 2.0's apps scale to fit tablet screens while retaining crystal clear picture quality.

App users can share your content on Facebook
Facebook Integration
Version 2.0 makes it easy for your app users to share content from your app will their Facebook friends.  With a tap of the finger, they can post events, videos, music, news items, and more directly to their Facebook profiles.

Support for Vimeo
That's right.  With version 2.0, you can import videos into your app from Vimeo by using embed codes.

Live Video Tab
Expanded Support for Live Video Platforms
We have expanded the Live Video feature to work with Ustream and YouTube Live accounts as well as Livestream.

New Live Video Tab
Now, when you connect your mobile app with a live video broadcast, a special tab will be the first tab that users see while the event is airing.  The tab contains your description of the live video event as well as a video icon, which takes the mobile user to the broadcast when tapped.

Upgraded Google Analytics
With version 2.0, you are able to track the usage traffic for your mobile website separately from your Apple and Android apps using Google Analytics.  In doing so, you are able to determine which content areas have higher usage rates and if there is a difference between usage patterns for those who visit the mobile website versus those who download the app to their mobile devices.

Over the next few weeks, we will explore particular features in greater depth with an eye toward how to maximize them to provide your audience with the most engaging mobile experience.

If you can't wait and would like to learn more now, visit the Mobile Suite Tutorial playlist on YouTube for step-by-step instructions on how to work with these new features and more.

Sunday, April 22, 2012

5 Tips for Customizing Your Mobile App’s Background Image

It may seem trivial, but a customized background image can make a world of difference for the mobile app experience.  The background image within an app can enhance the visual palette, fortify your brand recognition, and provide graphical context for the mobile experience.

Your InstantEncore app defaults to a solid black wallpaper. While this is certainly not the most exciting choice, it is a useful default color due to its neutrality.

When customizing your own background image, remember that you want it to be interesting but not obtrusive. It should be a tasteful, thoughtful representation of you or your organization.

Here are five tips to help you create a great background image for your mobile app:

Tip #1 – Prepare and upload an image according to the specified dimensions.
UPDATE: The recommended image size is 640px wide by 960px tall. Must be JPG or PNG format. Smaller images (e.g. 320 x 480) will load more quickly, but may not look as sharp on higher resolution devices. Larger images (e.g. 1240 x 1920) will look sharper on tablet devices, but will take longer to load initially.

It is usually best to avoid landscape-oriented photos, but you can easily modify one to fit the proper background size. Try cropping the image or adding onto it in creative ways. Sometimes it’s not the best choice to merely crop a portion of your photo to 640x960, since the result could be a larger distraction to the eye. When that is the case, you can try this suggestion:

A quick suggestion to turn your favorite landscape-oriented photo into a useable background image. Click here to enlarge the photo.
Tip #2 – Subdue and avoid bright hues.
The primary text throughout your app is white, so we recommend keeping your background image dark – the darker the better. A light background will cause your content to be washed out, and any abrupt textures will create too much of a disturbance for the user.

Background Sample A
Avoid light backgrounds and textures like this.
If you really insist on your background being a pile of sticks, because for some reason it’s the best representation of you, add a black overlay and bring the opacity down to about 85% to lessen the attack - though using such a hectic image is still not advised.
Textures are usually great for a unique look, just remember to keep it simple. Avoid sharp repeated patterns. At such a small screen-size, an overly busy texture is very off-putting. If you like a particular image, but you’re worried about how it will look behind the text in your app, you can add a black (or other dark solid color) overlay with the transparency set anywhere from 50%-90%, depending on just how busy or bright the image is you’re using. Then simply preview, adjust as necessary, and use your best judgment.

The best digital wallpapers, small or large, are those that are subtle enough to not take away from the foreground, yet maintain a fair amount of elegance.

Tip #3 – Avoid text.
Text will get in the way of the actual content in your app. When positioned appropriately, a little subtle text or logo is manageable, but too much text – no matter how faded it is – will be distracting.

Tip #4 – Match your splash screen and remember your color scheme.
An easy and effective background idea could already be right in front of you. Your splash screen image is already the right size, so why not apply it to the rest of the pages in your app? You may have to adjust the intensity of the colors, or remove (if not fade) any logos or images, but using elements from your splash screen for the background is a great way to create a beautifully unified look throughout your app. Choosing a complementary color scheme for your header and accent features will give your app the sophistication your fans are looking for.

Tip #5 – Preview your app.
The background image appears on every page, including any custom pages you create, so spend some time previewing your app to make sure the pages are readable and looking the way you want. Remember, you can update your background or change it out as much as you like, whenever you want to freshen up the overall look of your app.

Here are some background examples from various InstantEncore Partners to help inspire you.

To view the most detail, expand the slide deck to full screen.

Customizing a background image for your app is a small step in enhancing your mobile appearance, but it makes your content more approachable and contributes a unique visual environment. Users will undoubtedly notice and appreciate your attention to detail. 
Be creative, and have fun with your style!  If you would like feedback or suggestions on your background image, send us an email.  We're happy to help.