The concept of the website grew out of the meeting of minds of two designers visiting Doha for the Tasmeem Doha: hybrid making conference at the start of 2013 – Adelle Lin, spatial designer and Jorge Silva, web guru. The objective was to combine experience thinking across the two fields to create a site that was playful, visually stimulating but would also function as Adelle’s design portfolio.
The project took shape over many concept sketch exchanges and skype calls along with countless web drafts by Jorge. Most of the designer (Adelle)’s work utilises short film animation as one of the communication mediums and this became the core element to which the site mechanics were designed around. Motion is also an important element of the designer’s practice so incorporating this would add a layer of dynamism to the moving images. Some of the considerations included:
- How would the films traverse the page?
- Should they be clearly visible from the main page?
- What are the ranges of viewer interactions with the films?
- What would be the goals of the viewer?
- How clear or obscure should the mechanics be?
- How would the viewer comprehend their progress?
Having decided on a couple of possible directions, the next challenge would be seeing which of these ideas were actually possible. On a technical level, these ideas were very challenging and seeing how well they worked on actual code would be necessary, before actually going ahead and building the site. Some of these sketches were
Node map test
Media overload test
Motion films test
The team drew upon experience in designing gameful experiences in this regard. The site had to reward exploration and discovery but yet be able to communicate information that was useful to the visitor. There was a real tension between quick accessibility versus emphasizing the joy of discovery. This would eventually be resolved by using the about page which is accessible when clicking on the central Adelle Lin button.
A key theme of the site was the oversaturation of media today and the overabundance of choice that can create anxiety and stress. One can explore the site through 3 mechanisms – the node map, the homepage films and the project buttons at the bottom of each project page. This gives users in a hurry the flexibility in clicking through the site to get a quick overview and not have to spend too much time understanding the mechanics to unlocking the site. The more complex relationships being revealed through the site then become something that can be uncovered and understood over a longer period of time if the viewer chooses to invest that time later.
The visitor would start the visit to the site with 2 or 3 randomly generated choices of projects, indicated by the full colour of the film with the rest of the projects “locked” both mechanically and visually by the link being inactive and with a de-saturated coloring for the film. As the visitor explores the choices at hand, this “unlocks” related project sites. This is indicated by the originally desaturated films becoming fully saturated with a coloured tinge and active to be explored.
Also, project relationships are described by navigational buttons at the bottom of each project page, with precedence and future influenced project relationships being shown by directional arrows. Navigating the site in this manner provides a narrative experience for the visitor, where the designers thought process and conceptual development can be traced through the various project relationships.
Another way to navigate and view progress is through a node map that appears on the left hand corner of the site. The colors of each node match the colors of each project page. The node map grows with the exploration of the site. Also one’s position in the site is indicated by a larger node bubble radius, which project names appearing when one hovers over each bubble. This mechanism works similarly to the project buttons, however it does allow visitors to skip to different parts of the map more quickly.
There are of course a few shortfalls from the project – in choosing to present information in one framework means that other parts become more ambiguous. For example, the site cannot be organised according to discipline / practice. So although projects can be categorised through tagging, and in this case the index page within the about section, this doesn’t doesn’t affect the mechanic of exploring the site. The site also does not visually present the information in terms of the designer’s skillset, which would be useful to gaining insight into the distribution of skills across all the projects. This is addressed as a diagram either in the about page or as text within each project page, however the designer can conceive this being built into the node map as stage 2 of the project, becoming more of a data visualisation exercise.
Overall, the collaborators feel that the project addresses the objective set out initially and in itself has become a tool and good discipline for the designer to pull apart her practice and trace the development of her practice. It also explores new ways of presenting information and network relationships and hopes to demonstrate creative outcomes that can exist from interdisciplinary practice.