You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
221 lines
5.9 KiB
ReStructuredText
221 lines
5.9 KiB
ReStructuredText
10 years ago
|
General UI/UX requirements:
|
||
|
===========================
|
||
|
- Live updates
|
||
|
- No flicker:
|
||
|
* Sending message (local echo)
|
||
|
* Receiving images (encoding w/h)
|
||
|
* Scrollback
|
||
|
* Resolving display names (from user ID)
|
||
|
- Fast startup times
|
||
|
- Fast "opening room" times (esp. when clicking through from a notification)
|
||
|
|
||
|
|
||
|
#1 Web client UI
|
||
|
================
|
||
|
|
||
|
Model::
|
||
|
|
||
|
Rooms ----< Messages
|
||
|
- name - type (call/image)
|
||
|
- topic
|
||
|
|
||
|
Home Screen
|
||
|
What's visible:
|
||
|
- Recent chats ordered by timestamp of latest event (with # users)
|
||
|
- Your own display name, user ID and avatar url
|
||
|
- A list of public rooms (with # users and alias + room name + room topic)
|
||
|
What you can do:
|
||
|
- Create a room (public/private, with alias)
|
||
|
- Join a room from alias
|
||
|
- Message a user (with user ID)
|
||
|
- Leave a recent room
|
||
|
- Open a room
|
||
|
|
||
|
Chat Screen
|
||
|
What's visible:
|
||
|
- Enough scrollback to fill a "screen full" of content.
|
||
|
- Each message: timestamp, user ID, display name at the time the message was
|
||
|
sent, avatar URL at the time the message was sent, whether it was a bing message
|
||
|
or not.
|
||
|
- User list: for each user: presence, current avatar url in the room, current
|
||
|
display name in the room, power level, ordered by when they were last speaking.
|
||
|
- Recents list: (same as Home Screen)
|
||
|
- Room name
|
||
|
- Room topic
|
||
|
- Typing notifications
|
||
|
- Desktop/Push Notifications for messages
|
||
|
What you can do:
|
||
|
- Invite a user
|
||
|
- Kick a user
|
||
|
- Ban/Unban a user
|
||
|
- Leave the room
|
||
|
- Send a message (image/text/emote)
|
||
|
- Change someone's power level
|
||
|
- Change your own display name
|
||
|
- Accept an incoming call
|
||
|
- Make an outgoing call
|
||
|
- Get older messages by scrolling up (scrollback)
|
||
|
- Redact a message
|
||
|
- Resend a message which was not sent
|
||
|
Message sending:
|
||
|
- Immediate local echo
|
||
|
- Queue up messages which haven't been sent yet
|
||
|
- Reordering local echo to where it actually happened
|
||
|
VoIP:
|
||
|
- One entry in your display for a call (which may contain duration, type, status)
|
||
|
- Glare resolution
|
||
|
Scrollback:
|
||
|
- Display in reverse chronological order by the originating server's timestamp
|
||
|
- Terminates at the start of the room (which then makes it impossible to request
|
||
|
more scrollback)
|
||
|
Local storage:
|
||
|
- Driven by desire for fast startup times and minimal network traffic
|
||
|
- Display messages from storage and from the network without any gaps in messages.
|
||
|
- Persist scrollback if possible: Scrollback from storage first then from the
|
||
|
network.
|
||
|
Notifications:
|
||
|
- Receive notifications for rooms you're interested in (explicitly or from a default)
|
||
|
- Maybe per device.
|
||
|
- Maybe depending on presence (e.g. idle)
|
||
|
- Maybe depending on message volume
|
||
|
- Maybe depending on room config options.
|
||
|
Message contents:
|
||
|
- images
|
||
|
- video
|
||
|
- rich text
|
||
|
- audio
|
||
|
- location
|
||
|
- vcards (potentially)
|
||
|
|
||
|
User screen
|
||
|
What's visible:
|
||
|
- Display name
|
||
|
- Avatar
|
||
|
- User ID
|
||
|
What you can do:
|
||
|
- Start a chat with the user
|
||
|
|
||
|
|
||
|
#2 Bug tracking UI
|
||
|
==================
|
||
|
|
||
|
Model::
|
||
|
|
||
|
Projects ----< Issues ---< Comments
|
||
|
- key - summary - user
|
||
|
- name - ID - message
|
||
|
SYN SYN-52 Fix it nooow!
|
||
|
|
||
|
Landing page
|
||
|
What's visible:
|
||
|
- Issues assigned to me
|
||
|
- Issues I'm watching
|
||
|
- Recent activity on other issues (not refined to me)
|
||
|
- List of projects
|
||
|
What you can do:
|
||
|
- View an issue
|
||
|
- Create an issue
|
||
|
- Sort issues
|
||
|
- View a user
|
||
|
- View a project
|
||
|
- Search for issues (by name, time, priority, description contents, reporter, etc...)
|
||
|
|
||
|
Issue page
|
||
|
What's visible:
|
||
|
- Summary of issue
|
||
|
- Issue key
|
||
|
- Project affected
|
||
|
- Description
|
||
|
- Comments
|
||
|
- Priority, labels, type, purpose, etc..
|
||
|
- Reporter/assignee
|
||
|
- Creation and last updated times
|
||
|
- History of issue changes
|
||
|
What you can do:
|
||
|
- Comment on issue
|
||
|
- Change issue info (labels, type, purpose, etc..)
|
||
|
- Open/Close/Resolve the issue
|
||
|
- Edit the issue
|
||
|
- Watch/Unwatch the issue
|
||
|
|
||
|
|
||
|
#3 Forum UI
|
||
|
===========
|
||
|
|
||
|
Model::
|
||
|
|
||
|
Forum ----< Boards ----< Threads ----< Messages
|
||
|
- Matrix - Dev - HALP! - please halp!
|
||
|
|
||
|
Main page
|
||
|
What's visible:
|
||
|
- Categories (containing boards)
|
||
|
- Boards (with names and # posts and tagline and latest post)
|
||
|
What you can do:
|
||
|
- View a board
|
||
|
- View the latest message on a board
|
||
|
|
||
|
Board page
|
||
|
What's visible:
|
||
|
- Threads (titles, OP, latest post date+author, # replies, # upvotes, whether
|
||
|
the OP contains an image or hyperlink (small icon on title))
|
||
|
- Whether the thread is answered (with link to the answer)
|
||
|
- Pagination for posts within a thread (1,2,3,4,5...10)
|
||
|
- Pagination for threads within a board
|
||
|
- List of threads in chronological order
|
||
|
- Stickied threads
|
||
|
What you can do:
|
||
|
- View a user
|
||
|
- View a thread on a particular page
|
||
|
- View the latest message on a thread
|
||
|
- View older threads (pagination)
|
||
|
- Search the board
|
||
|
|
||
|
Thread page
|
||
|
What's visible:
|
||
|
- Messages in chronological order
|
||
|
- For each message: author, timestamp, # posts by author, avatar, registration
|
||
|
date, status message, message contents, # views of message
|
||
|
What you can do:
|
||
|
- Upvote the message
|
||
|
- Flag the message for a mod
|
||
|
- Reply to the message
|
||
|
- Subscribe to thread or message's RSS feed
|
||
|
- Go to previous/next thread
|
||
|
|
||
|
|
||
|
#4 Google+ community
|
||
|
====================
|
||
|
|
||
|
Model::
|
||
|
|
||
|
Community -----< Categories ----< Posts ---< Comments
|
||
|
Kerbal SP Mods, Help Text Text
|
||
|
(no title!)
|
||
|
|
||
|
Communities page
|
||
|
What's visible:
|
||
|
- List of communities
|
||
|
- For each community: # users, # posts, group pic, title
|
||
|
What you can do:
|
||
|
- Join a community
|
||
|
- View a community
|
||
|
|
||
|
Community Page
|
||
|
What's visible:
|
||
|
- Title, pic
|
||
|
- List of categories
|
||
|
- List of members with avatars (+ total #)
|
||
|
- Most recent posts with comments (most recent comment if >1)
|
||
|
What you can do:
|
||
|
- Join the group
|
||
|
- Post a post (with voting and options)
|
||
|
- Report abuse
|
||
|
- View member
|
||
|
- Expand comments
|
||
|
- Infinite scrolling
|
||
|
- Add a comment to a post
|
||
|
- Share a post
|
||
|
- +1 a post
|
||
|
|