Wednesday, 25 September 2013

Design - The Disorganiser (making)

Stage 6. Thumbnails


Initial thumbs 



First six are not ideal. Too much focus on cleanliness, straight lines, tightness, not enough looseness to really imagine and explore. Silhouettes didn't work so well either - given the fact that this device is to exist in somebody's pocket, we can't have a whole lot of protruding shapes that could get caught. It should be sort of streamlined - more like a phone than an opened swiss army knife.

Switched to a looser, rougher line-based method below. Also removed the lines to really free up the canvas and free myself up to start larger and smaller, removing focus on absolute scale for presentation and putting the focus purely on the drawing.


Revised process

View full size




23.09.13
Choosing which designs to continue with. Difficult! Did some research on form vs function. Unsure of whether I should be primarily judging on aesthetics (leading the eye, compositional, pleasing to the eye, etc) or functional (does it display the desired characteristics).
Also remember we want some variety to show the client or AD.

Idea: what if I selected a 'primary' attribute or dominant characteristic to display in the design and also use this at first in judging the worth of the designs? In this case - ANNOYING and COMPLEX



Crit Analysis on Thumbs

Narrow to 5, present to client - add a 'random element' to symbolise the client or art director making a decision? Use a dice!


8 and 9
Decorative touches are nice - give a definite sense of added value/expensiveness. 8 is very flowing and flowery. While this was a bad present on Sybil's part, I don't feel as though she'd have bought him something that he'd visually disagree with - she'd pick out something that looked like it suited him. So 9's angular decoration is a better choice than 8's more floral and feminine patterning.

Cube more difficult to fit in pocket if too large - so overall volume of the cube ones may be smaller.

Orientation of windows/vents at top could be better shifted to top or bottom, like a regular phone or calculator.



8 cut - too feminine

7 cut - 

9 has less annoying from this view (could add more speakers on other sides) but is an interesting shape not shown by the others and could go through more variations


5 cut - lacking in sense of complexity compared to other similar


12 cut due to shape - not really a pocket-appropriate shape, also window too small, placement of speakers feels off (why)?


6 left, narrowing down to 5. Cut number 6 due to window redundancy



Click for full size

Process of elimination - knocked out one-by-one the ones that were working WORST. Also noted on the sheet some things that were working and things that weren't in terms of filling the criteria.


Tried to base my choices on how well the design displayed what I decided were the most important characteristics - in this case, 'Annoying' and 'Complex'.


Click for full size

Dice roll to select 2 designs to carry on with - rolled using this sitehttp://www.random.org/dice/

Result: 2 and 5:





Stage 7. Iteration of Selected Thumbs

Took the two above selected images and worked on them further, looking at decorative elements and the arrangements of elements on the tops and sides.




A series had a stronger focus on square shapes, with square buttons and other right-angled forms. Unusual and awkward button placement

B series had a focus on incorporating the handwriting-recognition paper with a more modern conventional button placement


A1 - basic, tidied up original source design, made window more homely and added door.

A2 - tried some geometric patterns in corners, broke up the button layout to make it less static. Balancing the dark button area with the darker window.  Negative space largely contained within the horn itself. Horn nicely framed by box edges.

A3 - added darker patterned trim to edges of lid/base, adds a sense of weight and solidity, also frames and holds the eye within the side areas where buttons/windows are. Added latch and hinges to suggest a hinged lid. Inverted dark button colours, feels less balanced now. Increased density of geometric pattern, reduced line thickness - feels less eye-directing and more subtle - like a grip texture.

A4 - gothic trim, plain edges, horizontal striped base; feels broader, more sturdy on surface. Horizontal line along side trim of lid - too detailed, too cluttered.
Experiment with rounded up/down button to right to mirror the shape of the gothic windows, with more diverse scaling of buttons for added complexity.
Added gothic window.
Removed corner decoration and went with plain triangle - gives sense of less weight of lid.
Vertical line between 7 buttons and 2 buttons out of place - needs a twin at other end of negative space.
Each side quite well balanced - door-step and door-detail balances dark windows, many light buttons balance the 2 dark buttons.

A5 - Reversed button side (now unbalanced from this view point).
Reverted to square buttons instead of curved. Gothic window now draws the eye as the only large curved form on the sides.
Darkened side corners on lid. - more visual weight, feels heavier, frames the negative space of the horn very nicely.
Replaced simple latch with a locking latch - seems redundant given that there is a door. Perhaps replace with a regular latch.
Tidied up the and stylised the shape of the speaker. Set further into lid for practical purposes. Still a large area of negative space.
SCALE - latch really helps to solidify scale here. But in terms of acting it probably wouldn't work - too fiddly

To try: removing the hanging trim, adding some other sort of pattern to edge of lid

A6 - Added more detail/buttons to the sides - more complex. Too complex and cluttered?
Removed triangles from lid - feels much visually lighter and empty. Eye still directed to the horn but less held within that shape.
Vertical pattern of smaller buttons leads eye vertically from lid to base.
Gothic window gives a sense of STONE construction, therefore more weight, strength and a sense of being part of a more 'grand' building. Traditional square/rectangular window gives a sense of private residence and relatively less strong or heavy. Expensive vs less expensive.

Improvements to try - removing the hanging trim, adding some other sort of pattern to edge of lid, playing with corners of lid, reversing the right side. Try square window instead of gothic. OR try pointed/rounded button instead of square on far right.






B1 - medieval/gothic trim around top from reference, looks neat but would prove too flimsy and would stick out too much physically to be practical. Gothic-style windows interesting. Implication - more physically solid, heavier - stone church-like. Older, higher status, communal space. Door shape thematic link to stone building too - big, bulky hinges, knocker, etc.

B2 - replaced Gothic church windows with standard wooden window. Darkened sides distinguishes more clearly between sides and top. Shrunk buttons add negative space to top that contrasts strongly with the darker sides, eye drawn to top, where there is negative space, high contrast between dark button area and white. Recessed the paper to frame it and make it less likely to catch on pockets.
Usage orientation landscape.

B3 -  Simple addition of a hatch that hides the paper and protects it further, can be opened when desired. Usage orientation sill landscape, and  the form is somewhat reminiscent of a shop till, with the buttons and paper (like a printing receipt). Trim based on this pinterest reference of an old wooden four-poster bed. Gives a quite posh-and-proper old furniture look, regular breaks give a sense of order and structure. The way the writing hatch opens on the wider side is a lot more structurally sound and practical too.
Usage orientation portrait.

B4 and B5 - reorienting the hatch to suggest a portrait orientation of usage and therefore allude to cell phones and PDA in overall form.
Added an sheltered overhang to the slimmer side to allude to the charger/usb/headphone area on a modern cell phone. Here we have a window and door for the imp, as well as a light (perhaps to be removed - catch on pockets) and a card slot. The overhang protects the area from getting caught, and the bevelled edges prevent the overhang from catching on pockets.



B6 - My favourite. Phone-like form and layout, with a 'maintenance' area at the base (where charging, usb, etc would normally take place) that has the Imp's window, his door, and a card slot.
Detailing around the edge to add interest but relatively flat - won't catch on pockets, etc.
Inset horns to prevent catching. Overhang also serves to darken and hide the detail of the 'maintenance' area, thus making it less dominant and leaving the eye to look at the top surface where interaction primarily happens.

Meeting the complexity/annoying criteria: repeated horn shapes to give a sense of annoyance, and many buttons to give a sense of complexity. Needs a greater sense of complexity.

Improvements to try - draw eye to the 'screen' rather than the keypad - changes in contrast, line, detail? Base trim very bare compared to lid trim - perhaps some minor detail there. Buttons sit over overhang and feel strange - pull back and think about that negative space that is created.




Stage 8 - Final Line Iterations

Took A6 and B6 from above and made some adjustments.



A3 was chosen here - interesting alternate 'mood' created by the more expensive, sturdy and stately gothic windows. Triangles on roof add weight and frame the horn in the center - where there's a lot of rest space. Latch gives a sense of function to lid and some scale reference without giving a sense of imprisonment. Pointed button arrangement to right mirrors the window forms on left, adding some visual consistency and repeated visual motif to tie the windows in with the rest of the design in terms of shape.

B2 is the only iteration done here of the B series. Played with making the paper-hatch more dominant by adding detail and text, and by reducing contrast in the nearby button arrangement. Added a 'reset' keyhole to the maintenance area for some added detail. Hatch still not entirely dominant, which is an issue. We can use colour to try to solve this though.


No comments:

Post a Comment