Mockup Description
My digital mock up is a Balsamiq project consisting of 28 interactive mocks that walk the user through the following tasks:
Discovery of public and closed streams based on tags they engage with.
Following a public stream and requesting and accepting an invite to a closed stream.
Viewing content within a stream.
Posting to a stream.
Design Principles
Posts are enclosed in a solid black border, utilizing closure to show that all the content within the border relates to the same post. The same format is repeated for each post on the stream, using similarity to convey that these are all items of the same type (namely, posts). Similarly, list and menu items are separated by black lines, but follow the same general design of icon+label. However, items representing streams use different icons to indicate the type of the stream (user avatars for users’ personal streams, a dotted line for public and closed streams, and a hash sign for tag streams). Additionally, menus are broken up into different sections separated by a bit of whitespace, using proximity to relate each sections’ items together. The mockup also uses contrast to indicate when the user has unread notifications by changing the notification icon to red, and to indicate when the user is on the create post view or notifications view by changing the appropriate icon to white.
Feedback
Feedback from the user was that they liked how easy it was to like and reply (not implemented in mock) to posts, and how visible notifications were. They also liked the overall invitation request/receive/accept flow for joining a closed stream. They were however confused by not seeing their new post on the screen after posting it.
Balsamiq project, interactive PDF, and all mocks as PNGs on Google Drive









