11
Mobile Widget User Experience Guidelines Developing for the Vodafone 360 H1 and Vodafone 360 M1 by Samsung Vodafone 360 M1 Vodafone 360 H1

Vodafone 360 - User Experience Guidelines

Embed Size (px)

DESCRIPTION

Port-a-thons are sessions in different countries to support developer to port their widgets to Vodafone 360 apps.

Citation preview

Page 1: Vodafone 360 - User Experience Guidelines

Mobile WidgetUser Experience Guidelines

Developing for the Vodafone 360 H1 andVodafone 360 M1 by Samsung

Vodafone 360 M1Vodafone 360 H1

Page 2: Vodafone 360 - User Experience Guidelines

2

Contents

> What are the differences between the Vodafone 360 H1 and Vodafone 360 M1?

> What are the minimum requirements for developing a widget for the Vodafone 360?

> Do I have to conform to the Vodafone 360 user interface?

Page 3: Vodafone 360 - User Experience Guidelines

3

What are the differences between theVodafone 360 H1 and Vodafone 360 M1?

To the user:

> Not a lot.

To the developer:

> A little bit…

> Different screen specifications:

Vodafone 360 M1

3.2”

WQVGA / 400h x 240w

~146PPI

Vodafone 360 H1

88.9mm / 3.5” diagonal

WVGA / 800h x 480w px

~267PPI

Page 4: Vodafone 360 - User Experience Guidelines

4

What are the minimum user experience requirements for developing a widget on Vodafone 360 H1 and Vodafone 360 M1?

Widget closed mode icon

> Square, 200 x 200 pixels

– Note that the widget title is rendered as a semi-transparent overlay at the bottom of the icon. Therefore, leave a 51 pixel blank space at the bottom that is the same colour as the rest of the icon background

> Must be in PNG format

> Do not add rounded corners, the phone does it for you

> Do not use reflective gloss, the phone does it for you

> Do not use a 100% black background

> Do not use screenshots from the fullscreen mode of the widget

> Must not use a photo, unless it is a cropped, detailed part of a larger photo

Page 5: Vodafone 360 - User Experience Guidelines

5

What are the minimum user experience requirements for developing a widget on Vodafone 360 H1 and Vodafone 360 M1?

Widget extended mode icon

> Vodafone 360 H1, 230 x 230 pixels

> Vodafone 360 M1, 120 x 120 pixels

> Make use of all of the available viewport

> Minimum font size of 18 pixels / 4.7625mm for main text elements

> Show dynamically refreshed content, not just a static icon

Page 6: Vodafone 360 - User Experience Guidelines

6

What are the minimum user experience requirements for developing a widget on Vodafone 360 H1 and Vodafone 360 M1?

Widget fullscreen mode

> Must make use of 684h x 480w pixels for Vodafone 360 H1, and 342h x 240w pixels for Vodafone 360 M1

> The minimum size of an interactive element is 6.9mm

> If the widget is localised, it must:

– Localise UI text and/or content

– Accept localised input

– Display localised text correctly

– Provide language selection option

Page 7: Vodafone 360 - User Experience Guidelines

7

What are the minimum user experience requirements for developing a widget on Vodafone 360 H1 and Vodafone 360 M1?

Apps shop

> Apps shop icon must be a minimum of 200 x 200 pixels in PNG format

> App must have a title with a maximum of 50 characters, and a description with a maximum of 300 characters, but will be concatenated

> Minimum 3 screenshots, maximum 6 screenshots: 240w x 320h at 72 DPI

> Apps Shop banner: 204w x 136h pixels at 72 DPI

> Note: If you upload a widget for multiple platforms and it fails QA for one of those platforms, the whole upload process will fail. You will need to fix the QA issue on the respective widget platform(s) and resubmit your widget(s) for QA.

Page 8: Vodafone 360 - User Experience Guidelines

8

> No, you don’t have to

> But, you can if you want to

– We have visual design assets that matches the rest of the Vodafone 360 operating system

– We have visual design specifications documents showing you the how to lay them out on the Vodafone 360 H1 and Vodafone 360 M1

Do I have to conform to theVodafone 360 user interface?

Page 9: Vodafone 360 - User Experience Guidelines

9

Font support

> The only font available on the Vodafone 360 H1 and Vodafone 360 M1 isVodafone Rg regular, and

Vodafone Rg bold

Vodafone Rg regular

Vodafone Rg bold

Page 10: Vodafone 360 - User Experience Guidelines

10

Vodafone 360Theme colour settings

R 136

G 187

B 9

# 88BB09

R 0

G 153

B 218

# 0099DA

R 0

G 100

B 198

# 0064C6

R 243

G 149

B 0

# F39500

R 235

G 0

B 0

# EB0000

R 205

G 0

B 110

# CD00C6

R 137

G 42

B 160

# 892AA0

Green

Pantone_376

Now_376

Sky blue

Pantone_299

Now_299

Deep blue

Pantone_2945

Now_2945

Orange

Pantone_144

Now_144

Red

Pantone_485

Now_485

Wine

Pantone_220

Now_220

Purple

Pantone_520

Now_520

There are 7 theme colours used by Vodafone 360 phones which you may use to fit in with the look and feel of the device.

Page 11: Vodafone 360 - User Experience Guidelines

Thank you, andany questions?

Vodafone 360 M1Vodafone 360 H1