Web Development
Epopculture Store
Função
Desenvolver uma loja virtual para os produtos da empresa, permitindo que os clientes possam comprar online de forma fácil e conveniente.
Data
Jul. 2023
Empresa
Epopculture
Pesquisa de Contexto
Para dar vida ao projeto, iniciei uma jornada de imersão no universo da Epopculture. Através de um desk research, procurei as tendências do mercado, as necessidades do público e os principais players. Pesquisei o perfil dos consumidores, analisando seus hábitos e preferências. Essa imersão foi fundamental para entender a alma da Epopculture e traçar um caminho estratégico para o projeto.
14
de espectadores foram ao cinema em 2019, e a bilheteira arrecadou 80 milhões de euros em Portugal.
Data Source: ICA
1
de portugueses em plataformas de streaming
Data Source: Marktest
250
em receita do mercado de jogos em Portugal. +1,9 milhões de jogadores em Portugal.
Data Source: Marktest
12
de livros vendidos em Portugal em 2019 e 62% leram pelo menos 1 livro o ano passado.
Data Source: Marktest
II.
Sobre a Empresa
A Epopculture, sediada em Braga, é a empresa portuguesa referência em cultura pop. Possui algumas área de atuação como por exemplo eventos e exposições, notícias, loja online.
III.
Paleta de cores
Azul
#006DB7
Transmite segurança e confiabilidade aos consumidores. Essa tonalidade provoca sentimentos de proteção, estabilidade e profissionalismo, elementos essenciais para conquistar a confiança durante a jornada de compra online.
Vermelho
#F52B20
é uma cor poderosa que simboliza paixão, energia e urgência. É ideal para chamar a atenção e provocar uma resposta emocional forte.
Amarelo
#FDB014
é uma cor associada à felicidade, otimismo e clareza. É frequentemente usada para capturar a atenção e transmitir uma sensação de positividade e inovação.
IV.
Tipografia
A fonte escolhida foi a Titilium Web. É uma fonte sem serifa projetada com o objetivo de oferecer alta legibilidade e elegância tanto para textos impressos quanto para conteúdos digitais. Destaca-se por suas linhas limpas e modernas, tornando-se uma escolha versátil para uma variedade de aplicações, desde design de interfaces e websites até materiais impressos. Com uma ampla gama de pesos e estilos, Titilium Web proporciona flexibilidade e consistência visual, contribuindo para uma apresentação profissional e atrativa.
Titilium Web Headings
Hierarquia
Peso
Tamanho
Altura da linha
Espaçamento
Heading Level 1
Bold
64px
64px
0px
Heading Level 2
SemiBold
48px
64px
0px
Heading Level 3
Medium
32px
48px
0.5px
Heading Level 4
Regular
24px
32px
0.5px
Heading Level 5
Regular
16px
24px
0.5px
Heading Level 6
Medium
13px
16px
0.5px
Titilium Web Body Text
Hierarquia
Peso
Tamanho
Altura da linha
Espaçamento
Body Text
Regular
16px
24px
0.5px
Italicized
Regular Italic
16px
24px
0.5px
Bold
Bold
16px
24px
0.5px
Secondary Text
Medium
13px
16px
0.5px
V.
Desktop
Após a pesquisa e aprovação das diretrizes visuais, iniciei o desenvolvimento do layout para desktop, assegurando uma experiência rica e envolvente para telas maiores. Cada página foi projetada com atenção aos detalhes gráficos e funcionais, visando oferecer uma navegação intuitiva e visualmente atraente.
VI.
Mobile
Com a base de design para versão desktop definida, adaptei o layout para dispositivos móveis, garantindo que a experiência do usuário fosse otimizada para telas menores. Cada elemento foi ajustado para manter a usabilidade e a estética em diferentes resoluções e formatos, proporcionando uma navegação fluida e intuitiva.
