Idea!Zarvos

---

Encontrando a direção :: De site institucional para produto

A Idea!Zarvos renovou a arquitetura paulistana com projetos impactantes, plantas flexíveis e prédios conectados com a cidade. Seu anterior site não refletia a modernidade e inovação de seus projetos e a empresa desejava mais do que um portfólio para apresentar seus empreendimentos ao público.

Foi necessário um mapeamento direcional para organizar e priorizar por onde sua transformação digital começaria.

De um site institucional para um produto digital;

De um portal informativo para um espaço de referência e inspiração para os amantes da arquitetura;

De um catálogo de imóveis para um portfólio de projetos com curadoria e histórias por trás;

De um formulário de contato para uma experiência digital personalizada.

Com isso aterrisamos alguns pontos e levantamos algumas premissas para o projeto

Estética minimalista :: Os empreendimentos são as principais estrelas do site. É fundamental um design minimalista que não compita com o produto.

Design modular :: Os projetos da Idea!Zarvos são exclusivos e cada cliente pode personalizar sua planta conforme desejar. Trazer estes valores de modularidade e liberdade é fundamental para o site.

Curadoria editorial :: A Idea!Zarvos é uma marca aspiracional. Seu site também é destino de amantes da arquitetura e existe um grande potencial de se também uma revista digital sobre o assunto.

Storytelling :: Cada empreendimento tem uma história por trás. Esse fio condutor narrativo também é um recurso interessante de ser explorado em outras áreas do site.

De site institucional a produto :: O site foi desenhado para envolver todas as etapas da jornada de compra em um Idea!Zarvos, se posicionando tanto como Institucional, quanto como Produto Digital.

Site flow + Sitemap

Estudo de fluxos de navegação do usuário no portal. Esta etapa foi fundamental para avaliar os fluxos de área logada X logada e possíveis pontos de atrito da jornada.

Wireframes

Detalhamento funcional das features e arquitetura de informação das páginas do site. Nesta etapa é possível prever a como as informações irão responder à uma hierarquia, trazendo uma experiência fluída ao usuário.

Resultado final :: Área aberta do site

Detalhes da interface final do site da Idea!Zarvos.

Portal do cliente Idea!Zarvos :: Área logada

Paralelamente ao processo de evolução do site da empresa, um novo produto estava sendo desenhado: um portal exclusivo para os clientes Idea!Zarvos. Nele é possível encontrar informações relevantes sobre o imóvel comprado, como acompanhamento de obra, 2ª via de boletos, informações sobre o projeto, contatos úteis e perguntas frequentes.

Nesta frente de atuação, foram realizadas as seguintes atividades: Estudo de mercado, Wireframes, Fluxogramas, Testes de usabilidade (em protótipo) com clientes Idea!Zarvos para validar fluxos e também a relevância da ferramenta.

Handoff para desenvolvimento :: Especificação funcional

Com a finalidade de facilitar a comunicação com os desenvolvedores, a especificação funcional dos elementos do site foi organizada em um book para consulta.

Neste material, era possível encontrar detalhes de html e css para garantir a consistência visual e de interação dos elementos do site.

CSM :: Guia de uso de Strapi

A ferramenta de gerenciamento de conteúdo escolhida pelo projeto foi a “Strapi”.

Como parte do trabalho de usabilidade, o Strapi foi analisado para oferecer uma melhor experiência e maior intuitividade para o cliente cadastrar seus conteúdos.​​​​​​​

Ao final do projeto, foi construído um manual de uso da ferramenta para o cliente, assim como treinamentos para o time.

---

Aprendizados

Quando cheguei, o projeto da Idea!Zarvos já estava acontecendo a 3 meses.

Cheguei em um momento conturbado tanto para a agência (o diretor de UX tinha acabado de sair), quanto para o cliente (eles não tinham tão claro o escopo que gostariam de atuar.)
Peguei nas mãos uma série de materiais brutos, pesquisas realizadas que não foram analisadas, telas desenhadas porém sem fluxo. Nada fora do normal, trabalho em consultoria pode ser corrido e o início de uma pandemia também não é de muita ajuda num momento destes.
Sentei por um bom tempo para escutar todas as entrevistas, dei passos para trás para avaliar os potenciais fluxos oferecidos pelas telas, voltei para os “rabiscoframes” e murais do Miro.

Esse foi meu primeiro aprendizado: não deixar pontas no projeto. Um processo redondo, com começo, meio e fim, é chave para um projeto bem executado e organizado. Produto é organização, arquitetura é organização.

O segundo aprendizado que tive neste projeto foi: QA, QA e QA. No primeiro momento do projeto fui responsável por cuidar da qualidade da entrega, foram muitas horas de inspeção de páginas, contando pixels, abrindo cards de QA. Quando uma QA efetivamente entrou no projeto meus dias ficaram mais leves, rs. Ou seja, QA antes, durante e depois. Por favor.

Terceiro: o cliente tem a cara do negócio. Sim, parece ser meio óbvio. Mas quando digo isto é num sentido bastante amplo. A idea!zarvos é uma empresa reconhecida por seus prédios impecáveis no conceito arquitetônico e no design inteligente. E é claro que no sites deles nada menos poderia ser esperado.
Entendi que eles são um cliente extremamente visual e passamos para uma estratégia muito apoiada em UI para aprovação e avanço das entregas. Ou seja, Wireframe é importante? Sim! Um bom fluxo também? Com certeza.
Mas, se seu cliente é ligado no design; seja visual.

Selecionei apenas três aprendizados, mas poderia citar inúmeros. Este foi um projeto muito rico para meu desenvolvimento profissional.

---