Website Styling
Project Menu: Hauntology
Research:
Experimentation:
Design process:
Project Reflections and Future:
Adding Ambiguity and Intuition to the UI and UX of the collage creator:
Feedback on the current state of the Collage creator was that there needed to be a little more user exploration and discovery, and in order to achieve this the UI/UX of the site should be a little more intuitive and ambiguous, as without this the project was at risk of coming simply an image editor
This is actually inline with my initial intentions for the project, in which I try to avoid simply replicating some of the image editing capabilities of a program like photoshop or illustrator.
There needs to be reason and rationale behind design decisions made
In order to achieve this sense of ambiguity I began with some simple sketches of how it could possibly be implemented. I then progressed these sketches to medium fidelity prototypes.
I experimented with different ways to strip away the controls, opting to replace them with dials and sliders, similar to that of an analogue mixer.
I feel that an analogue style interface is in keeping with the idea and theme of Hauntology, taking something heavily used and a prominent cultural artefact of the past, and repurposing it into the present and my interface.
Quickly created Alternate Layouts attempting to incorporate ambiguity:
High Fidelity Prototyping:
In order to create the desired sense of ambiguity in the UX of the collage creator. I experimented with implementing abstract geonomical editing option. Not only does this feel inline with the aesthic of hauntology but, I feel like it also
Prototype Detailing Explained:
Sound Re-virb and Depth Edit:
On movement of the white dot around the lines of the interface, the revird and depth levels of the sound track would be altered.
Image Pixalation Levels:
Dragging the spheres and causing them to overlap will alter the pixalation levels of the currently selected image. If both spheres are placed ontop of each other this would represent full pixalation of the image.
Selection image movement:
These keys would be used to postion the currently selected image on the canvas.
W = Up
S = Down
A = Left
D = Right
Noise and colour reduction levels:
Positioning the white dot aroun the grid would increase or decrease the noise present on the image, it would also reduce or increase the amount of colour shown of a certain colour present
Filter Editing levels:
These sliders would alter intensity levels set by the filter options options available. a gradiant was used to avoid a more precise mesurement of intensity.
Image Filter Options:
Various image filters would be available, but unamed and possible randomised.
Reflections and lessons for the first version of my high fid prototype:
Feedback on this first draft of my final prototype was that the styling and feel of the site was inline with my project, but there still needed to be some further ambiguity and discovery to the UX of the project, but along side this, a little context or a more clear user journey. In the above state my project currently felt in a strange middle ground where it wasn't quite hitting either of the points just mentioned.
The idea of restricting control further for the user, so that they were not completely over faced with endless editing options was suggested, and I felt this was correct.