View website: www.830sign.com, Local copy

Home view

Zoomed in view

We created, in collaboration with the Communication Science Department of Siena University, Interaction Design area, four different scenarios to be presented to the audience responding to the target users.
The scenarios explore the key aspects of interaction with Itsme by illustrating everyday life excerpts of four user profiles (i.e. the personas):

• Carola – creative professional
• Livio – professor
• Sara – entrepreneur
• Gianni – manager

After having looked at the scenario the users were asked to fill in a questionnaire with 6 questions and a blank field to add free comments. Furthermore, whenever possible, in depth interviews have been conducted.

Itsme Conept Evaluation was presented during the Smau held in Milano and the Festival of Creativity held in Florence, in October 2008. After the events was reproposed as online version on the Itsme website.

Itsme Conept Evaluation is developed in Adobe Flash, the scenarios consist in four short streaming clips and, both in events and online version, feedbacks are gathered through Google Docs.

View website: evaluation.itsme.it

Main menu screen

Gianni survey screen

Thanks to Stefano Cardini, Emilio Genovesi, Chiara Muccitelli, Anna Pellizzari and Christian Tubito  for being spontaneous models and protagonists for the visual scenarios.

The website is basically a map in witch you can navigate trough. While waiting all the slides to be loaded, a quick tutorial introduce the user to the different navigation modalities.

The website can be navigated trough many different modalities:

• point and click to choose a single slide
• drop down menus pointing to each single slide
• arrows on the screen’s border to navigate the map
• keyboard’s arrows to move and space bar to zoom
• activating a navigator trough the ctrl/command key

Two different zoom levels are present: the shallow one, witch permits the user to browse the map, and the deep one, that permits content exploration and understanding.

View website: www.totaltool.it

Navigation tutorial

Zoom out view

Nevigation modalities

Half zoom view

Zoom in view

The website is basically composed of three sections: reach the place, where to sleep, choose a gift.
The first two sections are composed by static pages, instead the third one acts more as a guestbook: providing a possibility to choose a gift from the gallery and leave a message for the newlyweds. The system locks a gift once already chosen.

View website: www.pamelaestefano.it

Website intro

Static pages

Dynamic gallery and leave a message screen

Particularly i had the possibility to follow in deep the development of one mobile phone: the MD-300H. This phone is produced by BenQ for H3G italy, and sold under Momo Design brand.
As first collaboration between H3G and BenQ, the project’s goal was to have a product in line, in terms of information architecture and graphics, with the previous Momo Design models produced by the Chinese vendor ZTE.

The first important step was to define the information architecture. In order to make the BenQ mobile OS look and act like the reference MD interface i had to redesign the main menu and rearrange the sub menus, mainly trying to simplify the architecture, and i had to require the implementation of different features, from the tab system in menu screens to the media player.
The second step was to redesign all the graphics asset of the handset, ranging from the main to every small icon visible on the interface. Fortunately my colleague Mauro helped me in this job.

Interafce layout - Main menu, tab screen, textual screen

User interface screenshots

Demonstration video

In this video, a product review done by the guys of Telefonino.net, you can have a look at several user interface details. To view the video in HD press here.

The template allows us to place different slide on a surface, arranging them as part of a matrix. The user can navigate the presentation through three zoom levels, each one corresponding to a different interaction modality and a different quality of content:

• Zoom out view: pick and choose | table of content
• Half zoom view: explore | slide titles
• Zoom in view: browse | slide content

The system recognize titles as different objects form slides, in other words they are present and visible but not part of the navigation. This allows us to subdivide slides in groups, but to have fluent flow while browsing. The slide sequence recognized by the system is obviously left to right and top to bottom.

Zoom out view

Half zoom view

Zoom in view

Demonstration video

The video below is a demonstration of the presentation template in action. While in the “zoom out view” you can see the mouse pointer selecting the slides, in the other view the input are coming from arrows key for moving and from the space bar for zooming

View website: www.max-douglas.com

News page

Gallery page

Textual page

Client page

The project described below is an analysis of the 2006 PC client, based on few basic user tests, and two consequent restyling proposal of the front-end layout. The purpose of this work was to improve the actual layout on the user experience side and analyze how it could be opened to new feature introduction.

Actual layout review

Actual layout analysis

Alternative wireframe based on actual layout

Alternative wireframe based on actual layout - mockup

New layout proposal

New layout wireframe

New layout mockup

Final mockup and alternative configurations

Final mockup - extended configuration

Final mockup - alterneative configurations