top of page
Writer's pictureFisnik

Interface Style Guide #2

Updated: May 25, 2020

There was certain feedback I received which led to the decision to rethink the style guide for my interface:

  • The current UI design is appropriate in some ways, however, this current design could eluding in the user's mind that it is a science fiction project because of the:

  • Harsh corners, the perspective grid in the background.

  • All these detract from the fact that this is a serious project, exposing a serious issue, surveillance capitalism.

  • Aesthetic over function on the element background – static

  • Typography is very techy

  • People don’t really understand how advance the algorithms are in their social media.

  • I don’t want it to look like a game entirely, want people to take it seriously.

  • Challenge is to make inferences

  • The aesthetic is too close to fiction than it is to reality.



I agree with all the issues brought up. I have chosen a serious topic, and therefore I should do it justice by designing the interface in an appropriate way which allows for the user to also understand the severity of the topic. At the moment, this does fail.


I want back to the beginning for the UI design, creating wireframes in XD.


I kept the same layout. The camera data element would span the whole vertical width and take up a quarter for the vertical height. Previously, the camera element didn't span the full width because I was trying to achieve a one-point perspective effect where the elements hovered in a space and it made sense that it didn't take the full width. Now that I decided to remove this effect, from a UI point of view, spanning the full width allows it to look neat and well thought out.


Below I have attached the new wireframes, showing how I was thinking about the new design.


Dashboard data overview wireframe.

The new style removes the angler approach I took in the first design, replacing it with a normal, rectangular box element. I believe even this tiny adjustment from angular to 90 degrees corners changes the mood the interface is supposed to generate. No longer are feelings of science fiction produced.



Submit an inference wireframe.
View all inferences wireframe
Design an advert page wireframe

Tutorial wireframe

Tutorial wireframe

Tutorial wireframe

The interface layout remains the same.



 

Updated style guide



 

Interface design with the new style




0 comments

Recent Posts

See All

Comments


bottom of page