Get Updates By E-mail 

iOS App Design

Example: An App Using The New iOS 7 iBeacon API

  •  
  •  
  •  
  •  
  •  

Recently I mentioned a collection of iOS 7 source code examples demonstrating much of the new functionality added with the iOS 7 API – one missing example is a demonstration of the new iBeacon API.

Here’s a source code example working with the new iBeacon API from Nick Toumpelis called HiBeacons.

HiBecause allows you to demo both beacon advertising and ranging allowing you to see detected beacons in the vicinity.

Here’s an image from the readme showing a detected beacon:

HiBeacons

You can find HiBeacons on Github here.

A nice demo for the new iBeacon functionality.


  •  
  •  
  •  
  •  
  •  

Free Photoshop Actions And Automator Workflows For Easier iPhone/iPad App And Icon Design

  •  
  •  
  •  
  •  
  •  

Some time ago I mentioned a handy Mac app that allows you to preview Photoshop designs on an iOS device automatically from Bjango.

Here’s a handy collection  of Photoshop actions, Automator workflows and scripts released by Bjango.

This collection makes working with Photoshop easier especially if you’re working on iPhone or iPad app and icon design.

Here’s a brief summary of some the features added through these actions and Automator scripts (there’s a lot more handy actions included):

– Enable/Disable Pixel Snapping
– New document creation actions specifically for iPhone/iPad app design
– Global light changes that adhere to the HIG
– Color blindness testing
– Automatic document scaling to app icon sizes
– Add 88/176px to the bottom of a document for the iPhone 5

You can download the actions through Github here, and read more details about the actions on the Bjango web site.

A nice collection of Photoshop time savers for app design.


  •  
  •  
  •  
  •  
  •  

Free iOS Design Templates For Easy App Design With The Sketch App

  •  
  •  
  •  
  •  
  •  

I’ve shared a few design resources such as some good beginner iOS design tutorials, and free navigation bar designs.

Here’s a set of templates for designing iOS apps that I received in a submission for use with the Sketch App for Mac.  These templates include many different iOS UI design elements from different authors.

In case you haven’t heard of Sketch it is a popular design tool for Mac that you can find in the Mac App Store here.

As the Sketch description states:

Sketch is a designers’ dream toolbox. Specifically created for designers, it powers a beautiful interface and powerful tools. Tools every designer will appreciate. Here’s one feature — multiple shadows per layer. Making beautiful graphics isn’t challenging anymore. We set out to build a better app for graphic designers. Not to copy — rather to improve.

The vector tools and basic shapes are a fantastic starting point for any drawing, whether you design for web, icons, and more. Sketch has more advanced layer style options than you can dream of: multiple shadows, multiple fills, gradients, noise, blending, blur, and more. To top it off, Sketch has boolean operations to combine multiple shapes into much more complex ones — all of this is non- destructive. Forever.

And here’s an image from the readme showing some of the available elements created by Marfil:

Sketch

You can find Sketch-iOS on Github here.

Some great looking templates to aid in your app design.  Thanks to Steve for the submission.


  •  
  •  
  •  
  •  
  •  

Over 1000 Free Vector Components For Creating Mockups In Keynote

  •  
  •  
  •  
  •  
  •  

About two years ago I first mentioned the Keynotopia templates for creating interactive iPhone and iPad app prototypes using Keynote.

Since that time Keynotopia has grown and come out with a number of premium products.

Recently Keynotopia released a set of vector components in a hand drawn style (over 1,000 in the set) for free.

Here’s a video demonstrating how to go from the free components to a real prototype in a few minutes:

You can get the components here.

You will need to tweet to download the components, but it’s well worth it considering the size and the quality.


  •  
  •  
  •  
  •  
  •  

iPad 3 HD Retina Sized UI Design Template – Layered PSD With Many GUI Components

  •  
  •  
  •  
  •  
  •  

It’s widely expected that the Apple event later today (March 7th, 2012) will feature an updated version of the iPad known as either the iPad 3 or iPad HD and a display with double the resolution of the iPad and iPad 2 (2048×1536).

This means that it’s time to start changing the user interface within iPad apps to start supporting the larger display.

Fortunately Tope Abyumi has already created a PSD template with many different interface components including  buttons, alerts, popovers, and more all created with the new higher resolution – with extremely high quality.

You can download the template for free over at the App Design Vault.

Time to get a head start on designing those updated UI’s.

Added to the iPad development resources list.


  •  
  •  
  •  
  •  
  •