My ipad application will be the easiest way for users to select their favorite photos and automatically create a collage. Most similar applications have pre-selected frames to input photos manually into each space, typically limited to 4-5 photos. My application allows users to select up to 20 photos and have the application automatically create a unique frame to put them into. They are then able to shuffle the photos at the click of a button into a different arrangement and export.
Users first select where they want to pull photos from (camera, albums, facebook, flickr). Each option allows users to select as many photos as they like. Once they are selected these photos are put into a grid in a new review screen that shows all their selections. They can either add/subtract photos from here, or click a button to automatically generate the collage. Once the collage is generated the user can change the border width of the grid, color of the border, round the corners of the grids, change the overall layout of the collage from vertical to horizontal, click a button to reshuffle the photos into another layout, or export the collage to facebook, flickr, twitter, email, tumblr, or camera album.
I am in mid development of the application with a coding firm that was supposed to also do the graphic design. I haven't been very happy with their design work so I am coming to 99 designs to get much better work done. I believe the current design is too bland, doesn't have any personality, and is not attractive enough as it stands to entice users to download it. I would like to evoke a modern, minimal, streamlined design (I love the colors in the www.mojo-themes.com header and buttons, as well as www.mailchimp.com home page is a great example of a similar design aesthetic that I like). White, grey gradients and drop shadows, that light blue, orange= light, friendly, clean, and playful without being cartoony). I love how playful and interesting the navigation and menu buttons are at http://gridlens.bucketlabs.net/ for example.
All screens must be able to accomodate the updated Ipad 3 resolution (2048×1536 pixels).
I already have wire frames for some of the screens that have been coded into them. On these screens the designer will need to work around the placement of the buttons- you may not move these around but you can certainly dress them up and make them much more attractive.
The home screen is very flat and boring (screen 2 below). I am really looking for more depth and dimension here. The logo will go into the top of the page (I am still having this developed so please leave some space above the photo selection buttons for this- similar in positioning and placement as the Diptic application home page. I believe the top banner is very dull and boring, as well as the "i" button at the top. Please re-design this to be more interesting and replace the "i" with a "?" When a user clicks the "?" I would like a small box to pop up that describes how the app works on this homepage (quick example below- IMG_0075.png) I would like it to have 1. select your photos 2. review your photos and generate your collage 3. customize your collage 4. Share your collage! preferably with small icons for each. Feel free to play with the location ,size, and look of these icons.
The next screen for design is the review screen (auto_collage_select_photos). I would like the background from first screen you design to continue onto this screens background as well. The buttons on the bottom navigation have not been coded yet so feel free to play with the icons and placement on the bottom menu. The "?" in the top left banner should slightly grey over the screen with arrows pointing to each icon on the bottom menu (IMG_0792 and IMG_0795 for example) describing what each does (add more photos, remove photos, generate your collage!)
After the collage has been created (screen 4 below) the user has a few options. We have not created an interface for changing the borders after the user tabs the "borders" button. I've included a few examples below of how other applications do this. I would prefer a single slider that runs the gammet when slide through the entire color spectrum to change the borders color (rather than 3 different ones), a slider to change the thickness of the grids, a slider to round the inside grid corners (perhaps label it "round inside corners") and a slider to round the outside corners "round outside corners). Keep in mind this interface will be laying on top of the collage and I'd like the user to be able to see the changes being made as they slide each slider (perhaps a see-through opaque screen so they can see changes being made). Try not to take up a lot of real estate on the page.
I would also like you to create a simple popup menu interface for when a user taps the "orientation" button allows them to select a button or left/right switch that allows them to select a horizontal collage. This action will automatically generate a new grid/collage that is horizontal. If the button is tapped again it will allow the user to switch back to vertical using the same interface.
The shuffle button will be stationary and when tapped will reshuffle the images into a different arrangement.
Please include another screen when the "?" button is tapped that has arrows and describes what each button does, perhaps
1. Add or remove your photos
2. customize the color, thickness, and corners of the borders
3. choose a vertical or horizontal collage
4. shuffle will automatically generate a new layout
5. share your collage with the world!
The export button is stationary and will pull up the export screen (screen 5 attached below). Please redesign this to match the rest of the application's theme, you have complete control here over placement, layout, etc. We have decided not to use instagram at this time, please replace that with a twitter icon.
When exporting to Facebook and Twitter I would like the user to be able to enter a comment that will be put into facebook.
When exporting to flickr I would like there to be a place for the user to enter a title, another to enter a comment, another to enter tags (screenshot below- IMG_0083 for example) and a slider for the user to add it to the pool in flickr
When exporting to Tumblr I would like a place for comments, tags, and the same type of slider for "autotweet).
Please message me with any questons, thanks!
