Upstreet.chat Design Notes

We are looking to make a slick, fresh design for our new app, Upstreet.chat

Overall guidelines

We want to have our own brand identity and do something bold. Something for the Tik Tok generation but NOT Tik Tok.

Current Figma File:
https://www.figma.com/file/w7XUxmvpnvoHhiFBbu25rK/Upstreet

Current App:
https://upstreet.tv/chat

Mobile and Desktop

App needs to be responsive and work on mobile and desktop in portrait and landscape

Current Features

Next / Matchmaking
Picture-in-picture
Skeletal tracking
Microphone, speech to speech, text to speech
Chat
Profile
Character Selection

Screens

• Loading
  When the user lands, this is what they see immediately. We need to load the engine in the background. This could be a two-part – load the UI and load the engine immediately after, so the user can interact
• Home
  This is what the user sees after load. The user can chat, talk to new users
• Profile
  User can change their avatar and upload an avatar (this functionality is available in the other version of our app)
• Sign In
  User can sign in – this can be pretty simple

User Experience Considerations

V0

Try to encourage users to use microphone and camera as much as possible, since they add to the experience!

Matchmaking - User can press "next" to talk to someone else. When they are waiting for a human they are immediately placed with an AI.

Fullscreen - We want useres to fullscreen the experience if possible, without being annoying

Sharing - We want the user to be able to share the experience with others

V1

User profile modal - User can click on opposing user and add them as a friend or report them
Friends Screen - Users can add and remove friends
Chat Invites - Users can send chat invites and wait to chat with someone
Advanced Sharing - Users can send an invite and get a ping when someone wants to chat with them