Artist of the Week

  • Peszek’s Screens – Modernly Clean

Screen of the Day

Blog Posts posted by Marco Agas

Holo UI Tutorial

Following Google’s design guidelines, this clean and simple homescreen  is for true Android fans. Its green and white colors mixed with its clean weather widget, colorful icons and Android 4.2 designed clock all bring you a brilliantly designed homescreen.

Part 1: Before you begin

Download the files at the bottom of this post, and place all but PSD file onto your phone. Also see below for the apps you will need.

Part 2: Apex Settings

You’re going to need Apex Launcher Pro as your base launcher, but Nova Launcher Prime or  Holo Launcher Plus can also be used as the setups are virtually identical.

Here’s how you should set up the launcher, start off by selecting your Menu button then Apex Settings on your homescreen:

Homescreen Settings

Portrait Grid: 8×7 (for Nexus 4) 9×7 for Galaxy S2 and possibly other phones
Manage Screens: 1
Icon Size: 80% (but depends on screen)
Hide: Notification Bar, Shadows, Icon Labels
Vertical Margin: None (for Nexus 4) Large for S2 and other phones

Dock Settings
Hide Dock: Enabled

Behaviour Settings
Add gestures if needed

Theme Settings
Download and install Minimal MIUI, and apply it here.

Advanced Settings
Resize Any Widget: Enabled
Overlapping Widgets: Enabled (Pro Version only,but you can try work around it)

Part 3: Wallpaper

Here Photoshop will be needed (GIMP might also work), if you have a Nexus 4, and you have a Status and Navgation bar, you can skip the cropping part, so here is a quick breakdown of what happens in the video:

  1. Open the provided PSD in Photoshop.
  2. Select the “crop” icon, and drag the top and bottom handles so it doesn’t include the black bars.
  3. Select Image – Resize Image – Change this to your phones resolution.
  4. To resize an icon, press ctrl+T to bring up it’s resizing handles.
  5. To use your own user icon, drag over your desired image over the user icon area, then select only the square area with the rectangle marquee tool, right click – layer via copy.
  6. Now take off the “eye” image on the layers side on the left, of the image you dragged over.
  7. Drag the icon background and the whole background into one folder, select both of them using shift, right click – Merge layers.
  8. Select the app box line at the top, right click – Layer via Copy.
  9. Adjust this line as needed.
  10. Save file as a .png, copy onto your phone, make adjustments if necessary.

Now hold down on the homescreen – Wallpapers – QuickPic (or similar) and select your edited wallpaper, then save it as your wallpaper.

Part 4: Adding Icons

  • To add the app drawer icon – Hold down on the homescreen – Apex Action – App drawer.
  • To add any app icon – Simply open up the app drawer – Drag the app onto the screen.
  • To make the icon transparent – Hold down on the icon – Edit – Select the image – Select Picture – Change it to a blank.png.

Part 5: Eye in Sky

Add the Cities Eye in Sky widget – Clear icons – Black Text – Take off edit dots and refresh if necessary, then resize it accordingly.

Part 6: UCCW

You’ll need UCCW for this part, as well as copying the skins that are provided in the link at the bottom to your phone.

To add these skins:

  1. Hold down on the homescreen – Widget – UCCW – any size.
  2. In the main menu after tapping the widget, select “Open uzip”, now just find where you pasted the folder and look for the skin you want to add (Use the originals first).
  3. After it appears on your homesreen, resize it to the way it looks in the video.
  4. Add both the Clock and Date .uzips.
  • If a white box appears, use the modified skin provided.
  • You might have to re-position the skin’s objects, see the link below for more info on moving objects as well as general UCCW tips.
  • Turn Hotspots mode ON to prevent opening the editor each time.

UCCW Tutorials

Part 7: Search bar

Add a Desktop Visualizer if you have Apex Pro, or a search hotspot in the UCCW if you have Apex free. Sorry no more space to add in more info

Helpful links

Holo UI page on MyColorScreen
Icons, PSD, original UCCW skins
UCCW Skin, PSD & Wallpaper (modified, as seen in the video)
Blank.png (transparent icon)
Icons, PSD, original UCCW skins

Apps you will need

Minimal MIUI GO Apex Theme
Desktop VisualizeR (but not necessary)
Apex Launcher Pro
Eye in Sky

Like Us

Latest Tweets