Search This Blog

Sunday, October 26, 2014

Material Zune Pop

One of the first mobile platforms that had a UI that I enjoyed was the Zune HD but since I switched over to Android, I've been  hankering to have a more modern form of the same (or similar UI). Recently, I decided to purchase Zooper Widget because (aside from having enough Amazon Coins to complete the purchase), used it enough to the point where having access to its hotspot capability would help me bring the Zune UI to the modern Android interface. Also, the Android UI now looks clean enough to the point where it can do justice to what I liked about the Zune HD. The following is my setup to not only have a similar look as the Zune HD but include Android widgets, add some Material Design and use some Android 5.0 Lollipop animations as well.

The number of steps required may take some time but the hardest part (and the only part that costs money) is the Zooper Widget setup. I have included a link to my template to save most of your time in setting it up. From there, the text and hotspots can be changed as desired to match whatever apps you want quick access to. The setup is based on my 4.7" screen size so if the text size is adjusted, the spacing may need to be changed. For reference, I've spaced my text at 40 spaces apart vertically. The battery stats and calendar info are set at top left and top right respectively so only the font size needs to be adjusted if desired. I've listed the apps that each text hotspot launches so you know if you need to change it to another app (and rename the text if you want it to say something more relevant to your setup). I used a built-in font via Zooper so it should not be an issue but can be changed if it doesn't look right or you want to use another font.

Lastly, a bigger Zooper widget can be used (i.e. 4x4) if more hotspots are desired. The easiest thing to do here is to delete all text except for phone (leave the battery and date alone) and copy the phone info text, set the 2nd text and hotspot, figure out spacing, size, etc. then continue copying from 2nd text to 3rd, 3rd to 4th etc and adjust going down until done. If the battery and date info are not required they can be deleted but I like that information handy so I included it in my template.

  • Requirements
  • Setup (4x4 homescreen with dock off)
    • Nova Launcher
      • 4x4 homescreen
      • Vertical scrolling app drawer with Slide Up Transition Animation
      • (Alternative) Set app drawer to List to match Zune UI
      • Slide Up App Animation (under Look and feel)
      • Home button set to open app drawer
      • Dock off
    • 4x2 Zooper Widget
      • Download Zune Template
      • Create 4x2 widget and select SD Card to load template from device
      • Hotspots automatically load default app if available (may launch Google Play if unavailable)
      • All labels are text based and can be renamed with hotspots changed by individual label based on personal preferences
      • Date text set to launch Google Calendar
      • Battery text set to launch battery stats
      • Phone launches the default phone app
      • SMS launches Hangouts
      • E-Mail launches Inbox by Google
      • Notes launches Google Keep
      • Camera launches A Better Camera
      • News launches Feedly but can be changed to any app
      • Podcasts launchers Pocket Casts
    • 4x1 Power Toggles
      • Transparent background
      • All white color toggles - can be adjusted based on personal preferences, contrasting with wallpaper, theme setup, etc.
      • All toggles are handled by the app so no hotspot changes should not be needed, unless they don't work which may be more device specific
    • 4x1 HD Widget
      • Weather + 3 Day widget
      • Semi-Transparent background - can be adjusted based on personal preferences, contrast with current wallpaper, etc.
      • White icon set to match rest of homescreen
As you can tell, I do love the Zune UI quite a bit and replicating it in Android was a fun side project for me. I left the template open to adjustment because everyone uses different apps for the most part so having the option to adjust that was important to me. I also did this write up to share what I've done and hopefully make it easier for others to have a simple layout to match their needs.