Redesign e Migração para AWS - Website do Spani Atacadista


Imagem sobre portfolio

Sobre o Spani Atacadista

O Spani Atacadista faz parte do Grupo Zaragoza que atua desde 2003, e possui atualmente 26 lojas. O objetivo do Spani Atacadista é atender o pequeno e médio varejista, no sistema de autosserviço, atualmente conta com o atendimento de mais de 15.000 varejistas, com serviços exclusivos e política de preços diferenciados com mais de 300 ofertas semanais, valorizando esse público que é o grande foco da divisão.
A rede possui um site institucional reestruturado em 2021 pela CloudDog e um e-commerce por outra empresa.

O Desafio

Reestruturar o layout do website do Spani Atacadista, mantendo a sua identidade mas com uma proposta moderna que auxilie na divulgação da sua loja online (delivery). Além de propôr um novo design, também tralhamos no desenvolvimento para uma alta performance e na migração da infraestrutura para Amazon Web Services, garantindo uma melhor navegação para os seus usuários e facilitando nas acões de marketing digital da empresa.

Por quê escolher a Amazon Web Services

Para projetar uma melhor estabilidade aos clientes do Spani Atacadista, todo o conteúdo do website agora é servido através de serviços gerenciadas da AWS. Permitindo que a aplicação tenha um baixo custo de hospedagem e aumentando a disponibilidade, elasticidade e performance de navegação.

E também, foram utilizados outros serviços AWS, tais como:


- Amazon CloudFront: Para promover uma experiência de melhor performance para os usuários, por meio do armazenamento em cache, reduzindo o tempo de carga de conteúdos estáticos ou dinâmicos.

- Simple Storage Service (S3): Serviço de armazenamento infinito de objetos estáticos, utilizado para armazenar e servir através do CloudFront, conteúdos como HTML, CSS, JavaScript, Imagens e Documentos para o Website.

- Amazon API Gateway: Serviço gerenciado que administra as chamadas de API’s, através de requisições Rest/RestFull, ela atua como um endpoint seguro para fazer essas chamadas e retornar as respostas exibidas pela aplicação Web.

- AWS Lambda: Através do uso de Lambda é possível executar automaticamente códigos sem precisar que você provisione ou gerencie servidores. Basta escrever as funções que o código precisa executar e fazer upload para o Lambda.

- Amazon Dynamo DB: O Amazon DynamoDB é um banco de dados NoSQL para armazenar conteúdos de maneira elástica, de acordo com o tráfego do Website.

Arquitetura AWS

No diagrama abaixo é possível conferir o desenho macro da arquitetura após a implementação dos ajustes:

Arquitetura Spani-e-Villarreal

Os Benefícios

- Melhor tempo de carga do site como um todo;

- Maior velocidade de entrega de atualizações;

- Melhor posicionamento nos mecanismos de busca;

Apresentação do Redesign de Layout do Website

Com base nas informações do site antigo, reestruturamos o layout para se adequar a todos os dispositivos desde desktop, tablets e smartphones.

Funcionalidades

- Modal de Verificação de Lojas: aparece apenas no primeiro acesso, para identificar qual loja mais próxima o usuário quer ver as novidades.

- Google Search: sistema de busca que auxilia o usuário a procurar de forma mais rápida o que deseja encontrar no site.

- Push Notifications: permite ao usuário conferir as notícias do site em primeiro mão caso confirme a ativação em seu dispositivo.

- Geolocalização de Lojas: podendo ser visualizado de 2 modos (mapa ou lista), o usuário pode encontrar a sua loja mais próxima pela localização atual ou informando o endereço.

Novo Layout do Website do Spani Atacadista

Imagem 1 - SPANI Atacadista Portfolio
Apresentação do redesign do site do Spani Atacadista.

Imagem 2 - SPANI Atacadista Portfolio
O layout do novo website do Spani Atacadista foi desenvolvido com base na paleta de cores do logotipo. Sua estrutura foi construída para suportar todos os tipos de telas: desktop, tablet e mobile.

Imagem 3 - Spani Portfolio
Opções de busca de lojas para a loja mais próxima ou por endereço informado. O novo layout oferece 2 tipos de resultados de busca (por lista ou por Google Maps). Nas informações da loja contém links para Ofertas, Como Chegar (rota pelo Google) e Telefone.

Imagem 4 - Spani Portfolio
Por meio da geolocalização de lojas, o usuário acessa as ofertas da loja selecionada, com opções para visualizar no navegar ou fazer o download do tabloide.

Imagem 06 - Spani Portfolio
Screens das páginas na versão mobile.

Tags

#aws #migracao #elastic-beanstalk #cloudformation #rds #ec2 #load-balancer #auto-scaling #migração #geolocalização #layout #design #redesigndesite #website #ofertas #tabloidedigital
Portfólio

Outros trabalhos

Confira os últimos trabalhos no nosso portfolio.

fale conosco

Queremos realizar os projetos da sua empresa!

Fale conosco e saiba como poderemos ajudar a sua empresa a reduzir custos na nuvem AWS

+ 55 11 95026-0071contato@clouddog.com.br
Icone de Whatsapp