Modern UI Tutorial

This strikingly dark and bold homescreen creates a definitive modern feel. Starting off with the latest Android 4.2 clock, a neat and simple weather display and ending with sleek square blue icons, this homscreen is here to make a statement.

Part 1: Applying Apex Launcher Settings

Before you start, you will need to download the Wallpaper link at the bottom of this page and copy it to your phone. It includes the wallpaper as well as PSD for your phone. If your phone isn’t listed, you’ll have to either modify the PSD file to make it fit to your phone or use MultiPicture Live Wallpaper with only 1 screen. You’ll also need to download the blank.png icon that you’ll find at the bottom of this post.

You’re going to need Apex Launcher Pro as the base launcher, but the free version of Apex Launcher will also get you there if you manage the screen without using overlapping widgets.

Here’s how you should set up the launcher:

1. Set ‘portrait grid’ to 10×9 (or try others if this doesn’t suit you)
2. Vertical margin should be changed to Large, but might not be necessary depending your phone.
3. Manage screens should be changed so that there is only 1 screen
4. ‘Wallpaper mode’ should be Single Screen (non scrolling) and ‘Hide notification bar’ should be ticked.
5. Change your Dock Settings by scrolling down and selecting ‘Hide Dock’.
6. Go into advanced settings, and select ‘Overlapping Widgets’.
7. Change your wallpaper to the one provided in the link at the bottom

Part 2: Adding Clock and Weather Widgets

For the clock at the top, you’ll need Clock JB (unless you are running Android 4.2 where this is the standard clock widget), and for the weather widget below, you’ll need Eye in Sky Weather.

Just place them like you would a normal widget, for Eye in Sky choose the “Cities” type, make the wallpaper transparent, the text to white and hide the setting ‘dots’ if you want.

Part 3: Adding the blank icons

The icons as seen in the image are actually built into the wallpaper, so you will need to place the necessary app icon over the built in one, then change it to a blank icon with either of the two methods below.

Method 1:

1. Drag icons that you want from your app drawer onto your homescreen.
2. Hold down on the icon and tap the picture, then change it to the blank.png that you copied to your phone.

Another tip if your phone doesn’t align the bottom icons properly, is turning on your Dock in the Apex Settings, as you would now just drop the icons into the dock, then change them to the blank.png.

Method 2:

1. Use the Desktop VisualizeR widget, make it a 3×1 size.
2. Drag it over the icon you want, tap the new widget, change the icon to the blank.png.
3. Set the action to the app you want to open.

Helpful links:

Modern UI on MyColorScreen
Blank.png (transparent icon)
Wallpaper