organic design ui (2010)

Organic UI Design by Mirco Pasqualini http://www.linkedin.com/in/mircopasqualini

ORGANIC UI DESIGNby Mirco Pasqualini December 2002 - First DraftJenuary 2010 - Last draft


Progressive approachThat’s the most important rule for any UI Designer and Architect. The general dynamic of this argument is “the Interface change his aspect and complexity proportional to the evolving of User knowledge about the interface”.The perfect interface is when it will be customized for each user and evolving in the time for follow the user experience. The user found around him only he need.

Ambient determinate the aspectOne of most frequently error starting since the the beginning of each UI project is the Skin of interface. Very often we spend few time to understand how our UI design will be display in different device and how many different use it can have from each user. Itʼs look like as decide to be an Eskimo (People from North Pole), were like as an Eskimo and living like as an Eskimo and think to be able to live in any corner of the world from Africa, to Arabia, from Pacific to Miami. This is one of the most important needs of any UI. The Adaptation to the ambient. The adaptation donʼt change his main function but will determinate the look&feel and the interactive design behaviors.

Foundamentals


The elements determinate the group comportmentStarting to think at an interface like as a group of single elements, related them self with a strong property of grouping focused to a specific job/s. Now think to an UI like as a the people group of Survival Reality Show, the kind, property and expertise to each people will be determinate the good life or the death of entire team.This is the same things happen in any UI design project; choose the right UI element, interactive behaviors, how many elements determinate the result like as put chocolate into the milk for have a light brown or dark brown result.

Sharing is the engine of evolutionAt the base of any evolution process, the “sharing” capabilities, determinate the good or bad performing in any team. The best team in the world in any sport will be Football, Basket, Soccer, F1, etc.., are winner because they move like as “10” but they think like as “1”. They have a good based sharing knowledge, they have the same vision, same focus, same target with different roles. Sharing a method in the same UI or sharing a visual element in more elements grid make a best performing and make the structure more light.

Optimize and think ModularOptimize, Optimize, Optimize. Donʼt have any redundancy of UI elements, this help you to make a most quickly interface development and more easy update and customization process when needed. Think to each grid element like as modular, the Interface design reflects the typical human activity especially the mobility, Art and financial rules. In finance for example, when a modular unit donʼt work well and / or make debit, it will be close or changed with other without shake other unit parent or father.

ConslusionDesign an UI is exactly like as build a good Soccer team where you are the Team Manager.

Foundamentals


Objects definitionIn any interface grid, any element use and displayed will be considered like as an independent element. Each element will be linked with other and create a cloud of objects related by the same scope.

Each object is defined by: 1. Skin 2. Function 3. Property

BehaviorAny elements into an UI have a behavior determined by an event. Usually this events determinate the behaviors of other elements and in some case the changed of them. The clean and optimized UI design architecture determinate too the clean and easy behaviors organization.

Ambient and RelationLike as describe in the “Fundamentals” chapter, any elements will change is Skin for a best adapting to the ambient and group where it will be place. Usually the information about the Skin is provided by the ambient, like as a Soccer team provide colored T-Shirt to each players.

Object Oriented Vision

PropertyFunctionSkin


Complexity & User KnowledgeWhen you create grid and group elements focused to specific function, think the discover of this “grid” with a progressive approach. An other variable element of UI behaviors is the TIME and each USER. The TIME of experience of each user with the Interface determinate his knowledge of the tool and this is reflect into a sharing of “work method”, “Workflow” and “UI organization” between the tool and the User.Is like as talk with a Baby or talk with a professional Developer, the start point will be different.

EvolvingAn other step to consider when you design UI is the evolving of the elements and the grid in their skill and behaviors.Directly linked to previous point of “complexity” and “Ambient Relation” the design work, the look&Feel and architecture of the grid, require to be think into a progress evolution where very ofter you need to consider “not-programatic-evolutions-step”. Usually this is translate in “This space will manage future buttons or needs...”

Object Oriented Vision

DEVICE #1

UI Display & BehaviorsAdapter

UI FunctionsFramework

UI DataConnectors

DataServer

Devices

DEVICE #2

DEVICE #3


How StartA good start is collect more information possible about the project/interface focus, the elements/content and the ambients where it lives. This step i like call “Immersion” because you need to really go in the depth in to the UI “scope-of-life” and watch this stage with many eyes in all over side possible.

In the Immersion step you need collect:1. Information about the contents and their self-relations. 2. Define the UI grid you require 3. Define a list a User Profiles (capabilities, device, knowledge, expertise, needs, etc..) 4. Define a list of typical workflow for each user profiles (Make some survey ) 5. Do a benchmark between:

• UI do the same work with same content• UI do the same work with different kind of content• UI do a similar work with different kind of content but with similar complex relations them self.

6. Identify Interface solutions don’t have any relations with your project for “work” and “content but they represent and innovation approach if used in your project.

7. Introduce that you identify at point 6. The Interface design is like as a Movie or a Music composition, you require the main melody & synopsis but you need too the “Whaoo” effect.

8. Create a Visual Wire-frame of the UI and define the grid behaviors for ambient adaptation 9. Optimize the process and define each content details elements to place 10. Prototype the graphical UI merging the UI Needs and introducing the Innovation “elements” Refine and

re-evaluate the GUI with WF for a better match solutions.

Development Process


That’s the most important rule for any UI Designer and Architect. The general dynamic of this argument is “the Interface change his aspect and complexity proportional to the evolving of User knowledge about the interface”.

The perfect interface is when it will be customized for each user and evolving in the time for follow the user experience. The user found around him only he need.I know this is a redundancy in this document but is the MOST IMPORTANT THING!

Some sampleThe rules of Organic Interface is study from many years into digital business. For example from many years in many Microsoft desktop application like as Office Suite and recently into Adobe Suite, in the application menu, some option are hidden and the application show you only the main action (some time the most used) at first look. The user can ask to show all option available only on demand.

Thanks to progress of technology the Apple iPhone realize the vision of many years ago when the UI Designer understand about the future of UI start from physical products, where the interface will be change.The iPhone represent the best application of Organic Design. At the begin to the user offer only 1 option: “The start Button”. After it show him some other option (applications). His Human Interface is great because can change basing the use you want do of device (phone-call, gaming, messaging, etc..)

To talk more friendly when you meet a new people the first thing you say is “What’s your name?” and not “Which is the formula will explain the black matter into the black hole and hidden macro Cosmo?”

Human Kind Approach


Organic UI DesignCreated by Mirco Pasqualini

Email: [email protected] Skype: mircostudio LinkedIn: http://www.linkedin.com/in/mircopasqualini

Versione 1.0

All the abstract wallpaper picture used here are fromhttp://www.your-majesty.com/

NOTE: I pray you to excuse me for my incorrect syntax form but english is not my native language

Credits

organic design ui (2010)

Technology