Deployed: Novo Projeto Entregue

Hoje entreguei um novo projeto para um dos meus clientes parceiros. Melhor dizendo, após muitos testes em ambiente cloud — fora da máquina de desenvolvimento — e alguns fine tune no proxy reverso do Nginx, esta aplicação ganhou vida em um servidor de aplicação em ambiente de produção. Este projeto é o primeiro a utilizar em ambiente de produção a biblioteca que desenvolvi, ainda anônima, para o Dynamo DB, que em breve estarei disponibilizando via NPM.

Resumo do Projeto

• Nome: Bee Mailer
• Descrição: Sistema gerenciador de e-mail marketing, com suporte a grandes quantidades de dados, métricas, com o principal diferencial de envio de imagens de alta resolução (necessidade do cliente) com mapa de links.
• Tempo de desenvolvimento: 1 mês
• Tempo de deploy: 1 dia [:
• Principais tecnologias utilizadas:
• Server Side: Node.JS, Express
• Client Side: HTML5, Angular JS
• Armazenamento: DynamoDB
• Test Framework: Mocha
• REST API
• Ambiente de Produção
• Cluster: AWS EC2, com Load Balancing e Auto Scaling
• Armazenamento estático: AWS S3
• Rede de entrega de conteúdo: AWS Cloud Front

1. Dashboard

A dashboard exibe o número de total de assinantes, e listas, assim como as métricas da última campanha enviada, e um gráfico com as informações referentes aos últimos 90 dias desta. O quadro inferior é um log que exibe as informações de novos assinantes, realizadas via API, assim como aqueles que desejaram não receber mais.

2. Assinantes

Este screen demonstra a tela de gerenciamento de assinantes dentro de uma determinada lista. A tela é paginada para exibir até 50 assinantes, e a navegação pode ser feita pelos botões dentro do quadro azul. Para cada assinante é exibido a letra inicial do seu nome, dando para o responsável por esta tarefa, a consciência de organização, e rápida indexação conforme a lista cresce. Os botões laterais, ao lado direito de cada assinante, representam ações individuais, nas quais, edição, bounce, e remoção, nesta ordem. Bounce, representa se o assinante em algum momento desejou deixar de receber a newsletter.

Ao clicar no botão de edição, o assinante pode ser alterado a partir de um modal.

3. Campanhas

A screen de campanhas exibe todas as campanhas criadas em ordem cronológica, juntamente com um resumo das informação mais importantes definidos pela empresa. O botão branco que sobrepõe o frame exibe as informações detalhadas de cada campanha, na qual, além de envios, abertos e cliques, também, quantidade de usuários únicos, cliques únicos, denunciados como SPAM, hard bounce, soft bounce e rejeitados. O Botão vermelho permite que a campanha seja excluída. No canto inferior direito, o botão branco permite atualizar as métricas de campanhas, e o azul criar uma nova.

3.1. Nova Campanha

Como já descrito, a necessidade do cliente é de enviar imagens de alta resolução, com mapas de links, isto é, sem necessidade de elementos gráficos HTML. Para melhor entendimento da imagem, cada campanha pode ser personalizada com o nome do assinante inserindo a tag *|name|* no assunto. Em seguida, no corpo do e-mail uma imagem de alta resolução é inserida, e clicando sobre a imagem, podem ser incluídos links que serão mapeados gráficamente. Os links podem ser arrastados e redimensionados para melhor precisão.

Ao clicar sobre um link já mapeado, é possível edita-lo ou remove-lo.

4. Sumarizando

Este projeto de aparência simples demandou bastante horas de dedicação e estudo, principalmente em design. Não sou nenhum designer, sou programador, mas estou buscando aprimorar meus conhecimentos sobre design e usabilidade. Sempre que faço uma nova aplicação, penso que devo chegar o mais próximo de conseguir realizar uma ação completa em 3 cliques ou menos. Neste projeto realmente consegui aplicar este conceito com facilidade, pode ser porque ele seja simples, mas também por eu estar entendendo a verdadeira gênese de um design enxuto e prático, resultado de estar alimentando meu Kindle com algo além de livros de programação e empreendedorismo, mas também alguns livros de design. Uma recomendação:

Não se atenha a aprender somente aquilo que lhe interessa, dê uma chance para novos assuntos. Você pode gostar, e saberá como agrega-los em seu meio.

Obrigado a Beeleds por confiar no meu trabalho, e façam ótimo proveito desta nova aplicação.