project C:ALL

From student
(Difference between revisions)
Jump to: navigation, search
(VALIDATORS)
 
(37 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
__NOTOC__
 
__NOTOC__
 +
[[Project C:Home|go back to project page >>]]
  
<div style="float: left; width: 1200px; margin-right:20px; text-align:justify">
+
<div style="float: left; width: 1200px; margin-right:10px; text-align:justify">
  
 
=<span style="color:orange">INTERFACE</span>=
 
=<span style="color:orange">INTERFACE</span>=
  
<div style="float: left; width: 380px; margin-right:20px; text-align:justify">
+
<div style="float: left; width: 380px; margin-right:30px; text-align:justify">
  
===Concept===
+
===<span style="color:orange">CONCEPT</span>===
  
 
[[File:interface Dia copy.jpg|380px]]
 
[[File:interface Dia copy.jpg|380px]]
  
The interface of Spacebook will be the medium used by the social community to meet new people and organise activities in the real world.
+
The interface is the medium used by the users of the social community to interact with each other, organize and engage in activities in the real world and ultimately '''create their own place on the site'''. The interface is an online website and smartphone application. Stressing the online aspect will create the opportunity of an unlimited number of users having access to the interface.
  
The interface will be a tool that can be used by all people (it is not too hard to understand) but also gives a lot of freedom.
+
===<span style="color:orange">RESEARCH</span>===
  
===Research===
+
[[File:Interface_conclusions_re.jpg|380px]]
  
[[File:Interface_conclusions.jpg|200px]]
+
The research has looked at several software applications and games which showed the different possibilities and chances the interface would give the user.
  
The research done between several computer programs showed the different possibilities and chances the interface gives to the user and program. It clearly
+
Several general conclusions came out of this analysis:
  
showed that an an easy and understandable interface is linked to limited possibilities in the program. When the computer program offers full control of the
+
'''- an easy and understandable interface which has limited possibilities in the program is more appealing to the general user-public'''
  
content, the interface usually requires a lot of experience of the user.
+
'''- the average user prefers not to spend a lot of time always customizing the profile and prefers already-made configurations'''
  
Every interface had some parts that seemed very valuable to the concept of Spacebook: rotation (0-360) in 1 plane by the use of a button, zooming in and out
+
'''- an interface which offers full control requires a lot of experience and is more difficult to learn for the average user'''
  
by use of the scroll wheel, given pre-defined possibilities, opportunity to personalize given possibilities and a simple layout.
+
Every interface analyzed explore the following functionality:
These parts will be integrated with the Spacebook interface
+
  
===Validators===
+
'''- rotation (0-360) in 1 plane by the use of a button'''
[[Project C:interfaces_walter_aprile| Walter Aprile]]
+
  
===References===
+
'''- zooming in and out by use of the scroll wheel'''
  
[http://en.wikipedia.org/wiki/E-Booking_%28UK_government_project%29 E-booking]
+
'''- given pre-defined possibilities'''
  
[http://en.wikipedia.org/wiki/Interface_%28computing%29 interface]
+
'''- opportunity to make user - profiles '''
 +
 
 +
'''- generally simple layout.'''
 +
 
 +
These parts are integrated with the Spacebook interface design. The software used for building the interface will be [http://processing.org Processing] that drives the [http://www.grasshopper3d.com Grasshopper] parametric model of the site and the physical model of the structure fragment.
 +
 
 +
 
 +
References
 +
 
 +
[http://en.wikipedia.org/wiki/Interface_%28computing%29 Interface]
  
 
[http://www.adobe.com/products/creativesuite.html?promoid=ITXQM Adobe Creative Suite]
 
[http://www.adobe.com/products/creativesuite.html?promoid=ITXQM Adobe Creative Suite]
  
[http://en.wikipedia.org/wiki/StarCraft StarCraft]
+
[http://http://usa.autodesk.com/maya/ Maya]
  
Atom XX / Project XX
+
[http://http://www.rollercoastertycoon.com/ Rollercoaster Tycoon]
  
 +
[http://http://thesims.com/en_us/home/ The Sims]
  
</div>
+
[http://en.wikipedia.org/wiki/StarCraft StarCraft]
<div style="float: left; width: 780px; margin-right:20px; text-align:justify">
+
  
===Design Proposal===
+
===<span style="color:orange">VALIDATORS</span>===
  
Research into different interfaces led to the main criteria of Spacebook interface: able to zoom in on the 3D of the location by using the scroll wheel AND a
+
[[Project C:interfaces_walter_aprile| Walter Aprile]], expert on interface design:<br>
 +
''"the most successful interface is one the user already knows."''
  
zoom button; able to rotate around the 3D of the location by using the given buttons; only a limited amount of possibilities are possible; BUT the user has
+
[[Project C:computer_science_a_stoiculescu| Andrei Stoiculescu]], computer scientist.
  
the opportunity to personalize the possibilities; the easy layout make the interface easy to understand for anybody.
+
[[Project C:computer_science_S_Hagemann| S. Hagemann]], software engineer.
  
  
The user of Spacebook can be anybody: students or business men, but also people less experienced with computers, such as housewives or elderly people.
+
Edward Jansen, student Aerospace Engineering:
 +
''"The interface looks simple, I think I could work with it very easily."''
  
Therefor there will only be an online interface, and it will be a simple one: a clear overview of what is happening on the site, and a direct relation
 
  
between the input of the user and the (on the website) visible output. Research into interfaces showed that having a simple interface means less
+
</div>
  
personalization of the result. It also means that '''anybody is able to use Spacebook'''.
+
<div style="float: left; width: 780px; margin-right:10px; text-align:justify">
  
Three interface types of Spacebook are created: the standard user interface, the advanced user interface and the administrator interface.
+
===<span style="color:orange">INTERFACE DESIGN</span>===
  
 +
The design of the interface will have the following functionality:
  
<gallery widths="151" heights="98" perrow="4" >
+
'''- zoom in on the 3D of the location by using the scroll wheel and a zoom button'''
File:page01.jpg|Standard interface
+
File:page02.jpg|Standard interface
+
File:page03.jpg|Standard interface
+
File:page04-libary.jpg|Standard interface;user library
+
</gallery>
+
'''To book a space via the <span style="color:orange">standard Spacebook interface</span> is done with only a few easy steps:'''
+
  
'''<span style="color:orange">1)</span>''' After the user selected his preferred day and time an updated 3D layout of the location appears on the right side
+
'''- rotate around vertical axis of the location by using the given buttons'''
  
of the screen.<br>
+
'''- option of customizing ready-made profiles'''
'''<span style="color:orange">2)</span>''' The user fills out only two criteria: the activity type and the amount of people participating. Then on the left
+
  
side of the screen the standard solution appears.<br>
+
'''- a clear overview of what is happening on the site'''
'''<span style="color:orange">3a)</span>''' Three options to personalize the space are given: completely flat (open), a flat roof, or a dome structure. The
+
  
output is always directly visualized on the left side of the screen.<br>
+
'''- ability to make activities public or private'''
'''<span style="color:orange">3b)</span>''' Working in library mode gives the user the possibility to select space setups made and saved by other users. This
+
  
principle works via a popularity poll (most popular spaces at the top).<br>
+
'''- ability to link user made activities with each other'''
'''<span style="color:orange">4a)</span>''' The user has the possibility to link his activity to another activity by sending a link request. <br>
+
'''<span style="color:orange">4b)</span>''' When the user is content with the setup he presses the save button.
+
  
 +
'''- a direct relation between the input of the user and the visible output displayed on the website'''
  
<gallery widths="151" heights="98" perrow="4" >
+
'''- simple layout for legibility and ease of use'''
File:page05-advanced.jpg|Advanced interface
+
File:page06-advanced.jpg|Advanced interface
+
File:page07-admin.jpg|Administrator interface
+
File:page08-admin.jpg|Administrator interface
+
</gallery>
+
'''The <span style="color:orange">advanced Spacebook interface</span> gives the user more options to create his ideal space and works as follows:'''
+
  
'''<span style="color:orange">1)</span>''' After the user selected his preferred day and time an updated 3D layout of the location appears on the left side
 
  
of the screen. <br>
+
Three interface types of Spacebook are created for user-types:
'''<span style="color:orange">2)</span>''' By dragging his mouse over the grid, the user selects the preferred area for his activity. The output
+
  
automatically updates on the right side of the screen.<br>
+
</div>
'''<span style="color:orange">3)</span>''' The user has the possibility to personalize his entire space. The standard setting for the curve that defines the
+
<div style="float: left; width: 780px; margin-right:10px; text-align:justify">
 +
'''<span style="color:orange">BASIC INTERFACE</span>''' - the basic interface allows the user to choose ready-made generic shapes or custom-made <br> shapes created by other users. It is the fastest implementation of the interface.
  
space is 'medium', but the user has the possibility to change the curve to 'flat', 'small' or 'large'.<br>
+
<div style="float: left; width: 380px; margin-right:10px; text-align:justify">
'''<span style="color:orange">4a)</span>''' The user can also select more grid cells, directly next to his already defined space. This also appears on the
+
[[File:page01.jpg|380px]]
 +
1. Flat open surface
 +
</div>
 +
<div style="float: left; width: 380px; margin-right:10px; text-align:justify">
 +
[[File:page02.jpg|380px]]
 +
2. Covered space
 +
</div>
 +
<div style="float: left; width: 380px; margin-right:10px; text-align:justify">
 +
[[File:page03.jpg|380px]]
 +
3. Medium stepped arch
 +
</div>
 +
<div style="float: left; width: 380px; margin-right:10px; text-align:justify">
 +
[[File:Page04-libary.jpg|380px]]
 +
4. Library with custom made spaces
 +
</div>
 +
</div>
  
right sight of the screen. Together with his earlier defined space it starts creating an ensemble.<br>
 
'''<span style="color:orange">4b)</span>''' The user can then rotate around his created ensemble, and change the curve of each space individually.<br>
 
'''<span style="color:orange">5)</span>''' When a user would like to have a space made out of several curves in one row, he uses the 'division' button the
 
  
determine the beginning and ends of each curve. Each curve can be individually changed to the preffered setting (flat, small, medium or large).<br>
 
'''<span style="color:orange">6)</span>''' The created space will be saved when the user is done and added to the library.
 
  
 +
<div style="float: left; width: 780px; margin-right:10px; text-align:justify">
 +
'''<span style="color:orange">ADVANCED INTERFACE</span>''' - the advanced interface allows the user to customize his space by modifying the profile<br>  of the arches.He can then add his shape to the custom-made shape library for other users to try out.
  
The '''<span style="color:orange">administrator Spacebook interface</span>''' is created for the management of the physical Spacebook site (TU Delft?). The
+
<div style="float: left; width: 380px; margin-right:10px; text-align:justify">
 +
[[File:page05-advanced.jpg|380px]]
 +
1. Set the length of the space
 +
</div>
 +
<div style="float: left; width: 380px; margin-right:10px; text-align:justify">
 +
[[File:page06-advanced.jpg|380px]]
 +
2. Modify curvature of arches
 +
</div>
 +
</div>
  
administrator has the right to overrule any activity at any time for maintenance work or other jobs. He can overrule the system by selecting the cells that
 
  
will be inoperable at a certain time frame. There is also a administrator library where settings for maintenance jobs and spatial criteria are stored.
 
  
 +
<div style="float: left; width: 780px; margin-right:10px; text-align:justify">
 +
'''<span style="color:orange">ADMINISTRATOR INTERFACE</span>''' - the administrator interface is a general maintenance interface. It allows the admin to see the condition of the site and the performance of the components. It also allows the administrator to fix certain spots on the site and to manage the pathway system of the site.
 +
 +
<div style="float: left; width: 380px; margin-right:10px; text-align:justify">
 +
[[File:page07-admin.jpg|380px]]
 +
1. Pathway system permuations
 +
</div>
 +
<div style="float: left; width: 380px; margin-right:10px; text-align:justify">
 +
[[File:page08-admin.jpg|380px]]
 +
2. Various options for public space
 +
</div>
 
</div>
 
</div>
 +
[[Project C:Home|go back to project page >>]]
 
</div>
 
</div>

Latest revision as of 14:48, 30 November 2011

go back to project page >>

INTERFACE

CONCEPT

Interface Dia copy.jpg

The interface is the medium used by the users of the social community to interact with each other, organize and engage in activities in the real world and ultimately create their own place on the site. The interface is an online website and smartphone application. Stressing the online aspect will create the opportunity of an unlimited number of users having access to the interface.

RESEARCH

Interface conclusions re.jpg

The research has looked at several software applications and games which showed the different possibilities and chances the interface would give the user.

Several general conclusions came out of this analysis:

- an easy and understandable interface which has limited possibilities in the program is more appealing to the general user-public

- the average user prefers not to spend a lot of time always customizing the profile and prefers already-made configurations

- an interface which offers full control requires a lot of experience and is more difficult to learn for the average user

Every interface analyzed explore the following functionality:

- rotation (0-360) in 1 plane by the use of a button

- zooming in and out by use of the scroll wheel

- given pre-defined possibilities

- opportunity to make user - profiles

- generally simple layout.

These parts are integrated with the Spacebook interface design. The software used for building the interface will be Processing that drives the Grasshopper parametric model of the site and the physical model of the structure fragment.


References

Interface

Adobe Creative Suite

Maya

Rollercoaster Tycoon

The Sims

StarCraft

VALIDATORS

Walter Aprile, expert on interface design:
"the most successful interface is one the user already knows."

Andrei Stoiculescu, computer scientist.

S. Hagemann, software engineer.


Edward Jansen, student Aerospace Engineering: "The interface looks simple, I think I could work with it very easily."


INTERFACE DESIGN

The design of the interface will have the following functionality:

- zoom in on the 3D of the location by using the scroll wheel and a zoom button

- rotate around vertical axis of the location by using the given buttons

- option of customizing ready-made profiles

- a clear overview of what is happening on the site

- ability to make activities public or private

- ability to link user made activities with each other

- a direct relation between the input of the user and the visible output displayed on the website

- simple layout for legibility and ease of use


Three interface types of Spacebook are created for user-types:

BASIC INTERFACE - the basic interface allows the user to choose ready-made generic shapes or custom-made
shapes created by other users. It is the fastest implementation of the interface.

Page01.jpg 1. Flat open surface

Page02.jpg 2. Covered space

Page03.jpg 3. Medium stepped arch

Page04-libary.jpg 4. Library with custom made spaces


ADVANCED INTERFACE - the advanced interface allows the user to customize his space by modifying the profile
of the arches.He can then add his shape to the custom-made shape library for other users to try out.

Page05-advanced.jpg 1. Set the length of the space

Page06-advanced.jpg 2. Modify curvature of arches


ADMINISTRATOR INTERFACE - the administrator interface is a general maintenance interface. It allows the admin to see the condition of the site and the performance of the components. It also allows the administrator to fix certain spots on the site and to manage the pathway system of the site.

Page07-admin.jpg 1. Pathway system permuations

Page08-admin.jpg 2. Various options for public space

go back to project page >>

Personal tools
Namespaces
Variants
Actions
Projects
Atoms
Toolbox