by Paul M. Zahorosky of JerseyBoy Design Greetings and welcome to my tutorial on how to create a "Windows Phone 7" style "theme" on an Android device. This is not an exact copy of the Windows UI, but rather a new graphical interface for my phone greatly inspired by the image icons of the prototype Windows Phone 7 (as seen on XDA) and the "Living Tiles" of the actual Windows Phone 7. NOTE: Be sure to scroll through this entire first post (it's getting kind of long) for new and updated information. There are already dozens of icons and files to download and information for other devices will be added as needed or requested. ANOTHER NOTE: The only rule of this thread is the size of images posted. Please keep images to 750-pixels or less - otherwise the thread "stretches" wide and people have to scroll horizontally to read the post! Thanks. This was completed on an unrooted HTC DROID Incredible running LauncherPro Plus. Uploaded with ImageShack.us All of the image widgets are placed using Desktop Visualizer. Other tutorials on this type of theme call for using LauncherPro Plus to "resize" the widgets, but this creates irregular spacing between them. My solution to this problem is to start with the correct pixel dimensions for the images. This way they place at exactly the right size and all widgets are spaced perfectly (approximately 10-pixels, depending on the device). Before you start placing widgets on the homescreen: 1. Make a blank (preferably black) wallpaper to go behind the widgets. 2. Assure that "Auto-Fit Items" option is selected in the LauncherPro settings. Click here for examples plus a "why-and-how" to make this adjustment. 3. Change the number of rows to 5 by pressing: [MENU]->[Preferences]->[Homescreen Settings]->[Number of rows]->. Do not adjust the "5 Icon rows in homescreen" setting under "Advanced Settings". About the images: I created all of the icons from scratch myself using images from my personal photo collection, Google image searches, and Stock Exchange (stock.xchng - the leading free stock photography site). All images were resized by cropping in Photoshop (This post shows the process: Image Resizing Using Photoshop). Also using Photoshop, I added a 36-pixel high black rectangle with a 60% transparency and the white text with a small drop shadow (This post shows the process: Creating Image Labels in Photoshop). Use the "Save For Web" function under "File" and save the image as a .png file. Once completed, copy the .png files onto the phone (I put them in a "Widget Icon Images" folder in the /mnt/emmc folder). How to get the images as a widget: 1. Make sure the .png image files are on the phone. 2. Add a new widget to the homescreen (long-press empty space, select "Widgets" from pop-up). 3. Go to "Desktop Visualizer" and press the correct widget size (listed as width x height). 4. Press "Select Icon". 5. Press "Image File". 6. Search for and select your image (I use Astro File Manager for this as it shows a thumbnail and filename). 7. Press "Select Action". 8. Press either "Launch Application" and select application, ....-or- press "Other" to select a shortcut. ....NOTE: If you select "Other", "Activities", you can have widget trigger certain parts of ....certain apps (ie. go straight to "Alarm Clock" without having to go through "Clock"). ....ANOTHER NOTE: If you select "None", it will be only an image widget that does nothing. 9. Press the "Clear" button to delete all text in the "Label" box (If you leave the app name or type something in this box, it will show the label on top of the widget.. 10. Press "OK". Voila! You just created a widget with a custom image. Also... No LauncherPro widget resizing is necessary! For those who need a little help figuring out image sizes for the Desktop Visualizer widgets, the following list is based on LauncherPro's homescreen arrangement of 4-columns and 5-rows: 1x1: 110 x 125 1x2: 110 x 260 1x3: 110 x 395 1x4: 110 x 530 2x1: 230 x 125 2x2: 230 x 260 3x1: 350 x 125 3x3: 350 x 395 4x1: 470 x 125 4x4: 470 x 530 All dimensions are in pixels, width by height for a device with a resolution of 480 x 800. Image dimensions for other devices are listed in links below. When resizing images in Photoshop, I just used the "crop" tool, set the specific dimensions and ppi (I used 72) in the options box, then added the black rectangle and text. Android7 "Tile" Widgets: Now, I'm a graphics guy - not a code guy... so it took me a while to figure out how to make some "Living Tile" type widgets. Thanks to mykela25 for posting that she was "making custom unread count widgets". I asked her "how?" and she told me about APK Manager, which can "take apart" an app and allow for changing the image files for backgrounds, icons, etc. After a lot of trial and error I came up with some good, solid widgets that fit the style of this theme. Hopefully this helps to create an awesome and unique layout. EASY LINKS TO POSTS THROUGHOUT THIS THREAD Android7 Widgets for 480x800 Resolution (Solid color "Living Tile" type widgets) Android7 Widgets for 480x854 Resolution (resized by Curt941) Android7 Widgets for 320x480 Resolution Desktop Visualizer Widget Image Dimensions Direct links to every post in this thread that include pixel dimensions for proper alignment using Desktop Visualizer (updated 11/10/10): Desktop Visualizer Widget Image Dimensions - 576 x 1024 Resolution - Dock and Notification Bar ON Desktop Visualizer Widget Image Dimensions - 540x960 Resolution - Dock and Notification Bar ON Desktop Visualizer Widget Image Dimensions - 540x960 Resolution - Dock and Notification Bar OFF Desktop Visualizer Widget Image Dimensions - 540x960 Resolution - Dock ON and Notification Bar OFF HTC Incredible Desktop Visualizer Widget Image Dimensions With Notification Bar Hiding (480x800 resolution) DroidX Desktop Visualizer Widget Image Dimensions (480x854resolution) HTC Eris Desktop Visualizer Image Dimensions (320x480 resolution) HTC Sense Desktop Visualizer Widget Dimensions (480x800 resolution) Android7 Layout Using ADW Launcher - Without Dock or Notification Bar (480x800 resolution) Desktop Visualizer Widget Dimensions using GO Launcher (480x800 resolution) Desktop Visualizer Image Size Test - Use this if your resolution is not listed. Desktop Visualizer Widget Images Direct links to every post in this thread that include images for download (updated 12/19/10): NEW! Revised Android7 Icons by Paul M. Zahorosky of JerseyBoy Design (480x800) with new font to match Android7 Widgets. Incredible Android 7 Icons by Paul M. Zahorosky of JerseyBoy Design (480x800) - Part 1 Incredible Android 7 Icons by Paul M. Zahorosky of JerseyBoy Design (480x800) - Part 2 Incredible Android 7 Icons by Paul M. Zahorosky of JerseyBoy Design (480x800) - Part 3 Incredible Android 7 Stock Market Icons by Paul M. Zahorosky of JerseyBoy Design (480x800) Incredible Android 7 "Games" Icons by Paul M. Zahorosky of JerseyBoy Design (480x800) Incredible Android 7 "Mail" Icons by Paul M. Zahorosky of JerseyBoy Design (480x800) Incredible Android 7 Desktop Visualizer Icons by Krze RESIZED (480x800) Incredible Android 7 Icons by Excedio (480x800) Android 7 Icons by djbucksta (480x800) Android 7 "Teeter" Icon by djbucksta (480x800) Android 7 Icons by BlondeeLox (480x800) Android 7 Icon ImageShack Album by BlondeeLox (480x800) HTC Eris Android 7 Desktop Visualizer Icons by Paul M. Zahorosky of JerseyBoy Deisign (320x480) HTC Eris Android 7 "1950's Style" Icons by Paul M. Zahorosky of JerseyBoy Design (320x480) DroidX Android 7 Icons by Paul M. Zahorosky of JerseyBoy Design (480x854) - Part 1 DroidX Android 7 Icons by Paul M. Zahorosky of JerseyBoy Design (480x854) - Part 2 Incredible/EVO Android 7 Icons by dingopb New Expanded DroidX Android 7 Icons Images Only For Android 7 Theme Icons - Pre-Sized and Cropped Without Labels Android 7 Theme Desktop Visualizer Icon Libraries - ZIP files of all icons in this thread! Desktop Visualizer Widget Image Photoshop/GIMP Templates Attached files for easy download with every Desktop Visualizer widget dimension in a complete "blank slate" - ready for your images to be added (updated 11/10/10): View attachment 12477 - DroidX Desktop Visualizer Photoshop Templates View attachment 12904 - Incredible Desktop Visualizer Photoshop Templates HTC Incredible Desktop Visualizer GIMP Templates by Excedio View attachment 12734 - Dock Icons by paulmz @ JerseyBoy Design Fonts I used for my icons: Agency Myriad Pro Semibold Other useful posts: Direct links to other posts in this thread that have been particularly useful in completing this project (updated 11/10/10): Assign Desktop Visualizer Widget as a Direct Dial or Direct Message UPDATE: Enable LauncherPro Auto-Fit Option for Android 7 Theme Desktop Visualizer Update v. 1.1.1 Image Quality Setting Image Resizing Using Photoshop Image Resizing Using GIMP Creating Image Labels in Photoshop How to take screenshots of your Android based phone from Windows Desktop Visualizer Image Size Test - Use this if your resolution is not listed. Reskinning Widgets - A brief tutorial on using APK manager. Overlapping Widgets - Using ADW Launcher to make easy Android7 Tiles. How to slice one image into multiple tiles (by hard13). Here are the links to the xda-developers posts for the original idea: [Layout] Android Phone 7 (MDPI) - xda-developers [Layout] Android Phone 7 (HDPI) - xda-developers And, finally... This "theme" has been a lot of hard work. If you like what I have done and feel compelled to show your gratitude monetarily I accept donations through PayPal: Thank you to everyone who helped, contributed, and followed this theme.