Half a croissant, on a plate, with a sign in front of it saying '50c'
h a l f b a k e r y
Caution!
Contents may be not!

idea: add, search, annotate, link, view, overview, recent, by name, random

meta: news, help, about, links, report a problem

account: browse anonymously, or get an account and write.

user:
pass:
register,


                   

Intelligent Webskin

A layout technique that moves away from grids
  (+2)
(+2)
  [vote for,
against]

One of the problems with designing webpages or say user interface mockups in software like Fireworks, is that we rely heavily on grids, snapping and various simple alignment tools. Since we tend to assemble layouts from different elements (text, images, graphics), we are already used to the idea of putting various independent objects on the screen and arranging them in relation to each other in a manner that is pleasing to the eye, but usually quite laborious for the designer.

What would happen if these objects didn't sit on absolute screen coordinates, or in frames or tables, but were rather tied to each other with the equivalent of virtual springs or tensors, almost like the way cloth simulation is done in 3D packages? If you could throw a simple layout together, then manipulate it not by moving objects manually, but by tensing and untensing areas of the screen in order to tighten or loosen the layout? One could add a little intelligence to the system that would allow an image placed too close to a column of text, for example, to move aside a little and give the eye room to separate the two elements. Other layout elements would also shift automatically to compensate for the image having moved in the layout. The degree to which objects influence each other could be built around a few simple rules, and some weighting.

One might arrive at flexible layouts were users have the ability to tense and untense areas of a webpage in their browser for easier reading or navigation, or the user's browser contains a profile according to which the webpage would automatically alter the layout to bring it closer to what the user prefers.

neonardo, Sep 15 2003

CSS Zen Garden http://www.csszengarden.com
The content never changes, only the CSS. [waugsqueke, Oct 04 2004]

Please log in.
If you're not logged in, you can see what this page looks like, but you will not be able to add anything.
Short name, e.g., Bob's Coffee
Destination URL. E.g., https://www.coffee.com/
Description (displayed with the short name and URL.)






       Sounds very stylesheet-ish to me. Not sure what you're describing that cannot be done using CSS. (See link.)
waugsqueke, Sep 15 2003
  

       The link is quite neat, but what I had in mind was that each element in the layout (say three screenshots of a software next to a column of text in an online review) has a certain amount of intelligence with regards to where it places itself on the screen in relation to surrounding elements. Think of real time stragy games where you can group a bunch of infantry units and tell them to assume a certain formation or defend a certain area on a map. They position themselves intelligently with regards to each other, but also interact with the map they are on, and other elements on it. What I have in mind is that you throw a bunch of images on the screen, and tell them to form a column, or some other formation in relation to each other, then tell them to be mindful of other elements in their proximity. You should be able to throw a column of text next to them, and see them respond to that column, while being mindful of where they sit on the screen as a whole (in relation to a navigation bar that sits right on top of them for example). What I'm really talking about is to give some AI to screen elements, so that a small image placed to a larger one can think "I'm too small and too close to the image next to me; I'll either grow or shift position a little to keep the layout in balance". It would be really interesting if you could train layout software to learn over time how you instinctively arrange things on a screen, and attempt to do it for you, according to your rules, and under your supervision. The difference from more static templates is that the elements in your layout follow behavioral rules that you can influence. Does this sound too much like nonsense? Its a bit like taking elements on your dumb webpage and turning them into nanobots of sorts. =]~
neonardo, Sep 15 2003
  

       Might be successful, but only if implemented properly. I hate it when Microsoft Word tries to do my thinking for me and moves stuff around without my asking. Drives me nuts.
RayfordSteele, Sep 15 2003
  

       Some of the "layout managers" for Java UI development work similar to what you describe.
krelnik, Sep 15 2003
  

       The true kernel of inspiration in your idea is illustrated by the analogy to troop movement in a RTS game. Unfortunately, there is too much 'entrenchment' behind the idea that 'text + images = book' ... and consequently there is a whole litany of potential 'interactivity' that people are only now starting to consider. On the other extreme, those who are thinking 'beyond the book' usually employ flashy gimmicks that only irritate people (i.e., the aforementioned "autocorrect" phenomenon in MSFT Word)
drefty, Jan 24 2006
  

       It is a brilliant idea that can give designers more freedom of what they are trying to represent. Imagine DaVinci trapped on tables and frames. the system is also possible using some calculations like angle that the other object is and distance, and acting like it was programmed for,   

       if flexibility = static then movement = 0 movement_speed = 25 max_growing = 112% min_growing = 50% max_separation_from_XY = 200px spring_effect_speed = 45   

       Elements adapting just like bubbles. Attached to each other like with cordons or springs.
canoro, Aug 05 2007
  

       // Imagine DaVinci trapped on tables and frames. // as opposed to?
marklar, Aug 05 2007
  

       DaVinci's art is based all in geometry, but there's more to geometry than horizontal alignment and vertical or even diagonal. all the curves, ovals, are part of it. In web design we are limited to horizontal/vertical alignment of content.
canoro, Aug 05 2007
  


 

back: main index

business  computer  culture  fashion  food  halfbakery  home  other  product  public  science  sport  vehicle