In honor of Iron Man 3 opening this weekend, and because I absolutely LOVE Tony Stark (and all things geeky), I gave my Nexus 4 a bit of a makeover:
This layout was inspired by the actual UI guru, John Koltai. Be sure to visit his website for photos of the UI used in Iron Man 2. I wanted my Android phone to look as accurate as possible next to the movie’s UI. Hence, I created all the widgets and icons myself.
The main difference between my “inspired-by” design, and the IM3 movie version is Tony Stark’s phone is typically shown in landscape format. However, about 95% of my use is in portrait mode and I adapted my design to that purpose. Now… on to the apps I used, the files you’ll need, and a tutorial to re-create this layout.
+ The Apps +
- Apex Launcher Pro by Android Does. You can substitute Nova Prime for Apex if you prefer.
- UCCW aka Ultimate Custom Clock Widget by VasuDev. Hint: This app basically builds graphics, images, and widgets in a very similar way to Photoshop. You can even save a layered design as an image! UCCW = Awesomesauce.
- Gallery by Google/Android. This is the default photo gallery app that comes packed with Android 1.5 and up. If you need an alternate, QuickPic by alensw would also work.
- Simple Calendar Widget by MyColorScreen. Free on the Play Store.
+ The Files +
Due to the popularity of this home screen UI (Thank you everyone!), I have uploaded the files I used to create this UI to Dropbox. There are two zips and a jpg: one zip for the icons and dock; the other zip for the UCCW files; the jpg is my wallpaper. All of the UCCW’s can be modded to suit your own hotspots, icons, colors, etc. The UCCW’s also include the typefaces I used which were: Roboto Light, Roboto Thin, Roboto Condensed Light, and Roboto Condensed Thin. The Roboto font family can be downloaded on Google’s Android Developer site.
+ The Tutorial +
- Homescreen settings using Apex Pro: 10×10 grid, portrait only mode. Set the margins, shadows, status bar, icon labels to NO/None. 3 screens. Set to allow widgets to overlap.
- Apex dock settings: One dock with seven icons. No margins. Set dock background as custom. Icon size/scaling set to 80%.
- Add/drag 7 applications to dock area of home screen. then long press and choose which icon to apply. For what it’s worth, I used the Iron Man ma
- Use UCCW to create the rest of the layout.
- Widget sizes: Top status bar= 4×1 stretched & placed on all 3 screens. Radar UCCW= 3×3. Signal Override Terminal UCCW= 4×2 & stretched.
- Widget sizes (2): Commandeering System= 4×1 & stretched & overlapped. The 8 “buttons” = 2 UCCW widgets. Each one is 4×1 & stretched to fit.
- Widget sizes (3): Initializing Access UCC= 4×1 & stretched. Queue UCCW= 4×3 & set to “send to back” (see below).
- In the Commandeering System UCCW, the “loading bar” is actually UCCW’s battery bar.
- Use Simple Calendar widget (w/ full background transparency) to place Calendar events over the Queue UCCW.
- Download/Add at least four Iron Man blueprints/photographs/images to your phone’s internal or sdcard storage system. I found mine via a Google search for “Stark Industry blueprints”.
- Long-press on your homescreen, add a Photo Gallery widget. Set to “album” & load a few Iron Man photos, blueprints, etc into an album on your phone.
- Set hotspots within UCCW as you choose!
- For finishing touches, Zedge has some great Iron Man and Jarvis sound effects for ringtones, notifications, etc.
+ Nifty Bits & Tips +
- Swipe across the Photo Gallery widget on the homescreen to flip through your blueprints! Just make sure all the photos/blueprints/images you want to appear in your flippable widget are in their own folder on your sd card.
- The bar of color in the “Commandeering System” widget is alive. It constantly updates to show the battery level of your phone.
- There’s handy info hiding in plain sight within the “Signal Override Terminal” widget. The Port number is actually the date; SSID shows the day of the week; Strength tells you the current temperature for your location; and the Status reports your current weather conditions.
- Instead of using the radar UCCW I included in the zip files – use a live radar app with a widget instead. Why? Because adding movement and interactivity is just frakking cool.
Be sure you have your tickets and… enjoy the movie!
Questions, comments, constructive criticism, please leave me a comment.
Cheers with buttered popcorn,