Voltar ao portfólio
Projeto autoral

Stream — painel para transmissões ao vivo

Um aplicativo desktop em tema escuro para transmitir ao vivo: informações da transmissão, pré-visualização com chat e um painel de controle de cenas, fontes, áudio e estatísticas.

Papel
Product Designer
Escopo
Aplicativo desktop
Foco
Transmissão ao vivo
Tema
Escuro
Janela do aplicativo Stream em tema escuro, com informações da transmissão, pré-visualização de vídeo, chat e painel de controle, sobre um fundo de montanhas roxas

Conceito

Tudo o que a transmissão precisa, em uma única janela

O Stream é um projeto autoral de interface para um aplicativo desktop de transmissões ao vivo. A proposta foi reunir, em uma única janela, o que quem transmite precisa acompanhar: o que está no ar, a conversa do público, os controles da produção e o desempenho do computador. Os nomes, mensagens e números exibidos na tela são fictícios, criados apenas para o design.

Solução

Três áreas para conduzir a transmissão

Informações e pré-visualização

À esquerda, os dados da transmissão: título, episódio, categoria, público, nota de início e tags, com botão de salvar. Ao centro, a pré-visualização do vídeo ao vivo e, à direita, o chat com campo de mensagem.

Painel de produção

Na parte de baixo ficam as telas, as fontes (como webcam e captura de jogo), o mixer de áudio com controles circulares, a transição entre cenas, com efeito e duração, e os botões circulares de controle, um deles em vermelho.

Métricas em tempo real

Cartões mostram o tempo de sessão, os seguidores, as curtidas e as visualizações, além de medidores de uso de GPU, memória e CPU, para acompanhar o desempenho durante a transmissão.

Elementos da interface

Pré-visualização ao vivo Chat com campo de mensagem Cenas e fontes Mixer com controles circulares Cartões de métricas Cartões flutuantes

A interface

A janela em duas partes

Um tema escuro com o roxo como cor de destaque, cartões arredondados e um título em negrito para a transmissão. Alguns cartões saem da janela, como se flutuassem sobre o fundo. A seguir, a parte de cima e a parte de baixo, vistas de perto.

Parte superior da janela do Stream, com as informações da transmissão, a pré-visualização do vídeo e o chat

Informações da transmissão, pré-visualização e chat

Parte inferior da janela do Stream, com telas, fontes, mixer de áudio, transições de cena, controles e estatísticas

Telas, fontes, áudio, transições, controles e estatísticas

Visão completa

A tela inteira

A janela do Stream por inteiro, sem cortes, com os cartões flutuantes, a barra de tarefas e o fundo de montanhas.

Tela cheia do aplicativo Stream, com a janela completa, os cartões flutuantes e a barra de tarefas sobre um fundo de montanhas roxas

A tela cheia do aplicativo