Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Honeycomb User Interface Design @iRajLal

13,827 views

Published on

A User Interface for Mobile device inspired by Honeycomb structure with Hexagonal Grid

Here are the links to the two design patents:

http://www.google.com/patents?id=ltXKAAAAEBAJ

http://www.google.com/patents/about?id=wOfUAAAAEBAJ

Published in: Technology, Business
  • Great idea. Its something I've thought about before but never went that far into.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Get my book on User Interface design guidelines and best practices here http://www.designuserinterface.com/
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • A User Interface for Mobile device inspired by Honeycomb structure with Hexagonal Grid

    Here are the links to the two design patents:

    http://www.google.com/patents?id=ltXKAAAAEBAJ

    http://www.google.com/patents/about?id=wOfUAAAAEBAJ
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Honeycomb User Interface Design @iRajLal

  1. 1. Honeycomb DesignFor touch screen mobile devices Rajesh Lal
  2. 2. Agenda Honeycomb Design Basis of the Design Benefits Interaction Target Devices
  3. 3. Honeycomb Design Honeycomb Design – Mesh of Honeycombs – One hexagon for one App
  4. 4. Honeycomb DesignBasis of Design Honeycomb conjecture proofs that Hexagonal tiling provides the least-perimeter way to enclose infinitely many unit areas.
  5. 5. Honeycomb Design Benefits – Optimum space for individual apps – Variety of customization option – Best suited for thumb interaction – Provides consistency in User Interface – Suited for Right handed, Left Handed and Landscape interaction
  6. 6. BenefitsProvides optimum space for individual apps <- Honeycomb design 19 Apps -> IPhone Square design 20 Apps
  7. 7. BenefitsVariety of Customization option
  8. 8. BenefitsBest Suited for Finger interaction particularly thumb interaction
  9. 9. BenefitsConsistency in User Interface Consistent - Central view - Main Apps View (Lower bottom – Left Image) - Custom Setting View (Right Image)
  10. 10. BenefitsRight handed, Left Handed & LandscapeLeft Handed Landscape mode Right Handed
  11. 11. Honeycomb Design Interaction – Settings Screen – Swap individual Apps – Title / Updates – Border & Color – List Tiles
  12. 12. Interaction Customize Settings Screen  6,10,11,12,15,16,17, 33,35,37,38 and 39 active Tap on a hexagon to Change the state - Active - In Active - Ready Ready State Icon can be swaped
  13. 13. Interaction Swap Hexagons Tap on a hexagon to change the state - Active - In Active - Ready Ready State Icon can be swaped with other Ready item (10 and 17 shows two ready items)
  14. 14. Interaction Title / Update  On Touch the top half of the hexagon will show the title  Bottom half will show the updates  If only top half of the hexagon is visible show the Title as shown in the figure (music and video)
  15. 15. Interaction Border & Color  The border width of Hexagons can be customized (Picture shows border gap size of 10 pixels)  Border color can also be customized
  16. 16. Interaction List Tiles  All the Tiles can be listed in horizontal as well as vertical list view
  17. 17. Honeycomb DesignTarget Touch Screen DevicesFlip Pones Mobile Internet device PDA/ Pocket PC Smart Phones
  18. 18. Thank You Rajesh Lal Senior UI/UX Engineer

×