Manual de estilos web

Produção de esquemas de diversas partes importantes para nova plataforma, para orientar as equipes de UX e desenvolvimento

A plataforma estava passando por uma refatoração, daí, para facilitar esse processo, principalmente nos momentos de prototipação, e poder produzir desenhos o mais próximo possível com o entregável pelo time de desenvolvimento a sugestão foi produzir um manual de estilos com os componentes básicos da estrutura, que poderiam ser reutilizados a qualquer momento pelo time de UX…

A plataforma estava passando por uma refatoração, daí, para facilitar esse processo, principalmente nos momentos de prototipação, e poder produzir desenhos o mais próximo possível com o entregável pelo time de desenvolvimento a sugestão foi produzir um manual de estilos com os componentes básicos da estrutura, que poderiam ser reutilizados a qualquer momento pelo time de UX…

Também é importante ressaltar que esse trabalho não cobriu a parte de dashes, que não seria alterada.

Existem também outros esquemas, mas acredito que esses são os principais. e também é interessante ressaltar que podem ter sofrido variações, de acordo com o andamento da aplicação

Landing Page

Com esquemas para os elementos:

  1. Topo simplificado, com seleção de fazenda evidenciado
  2. Barra de navegação no estilo breadcrumbs
  3. Modelo de busca simplificado com debunce 
  4. Modelo de grid com esquemas para opções extras, com proposta minimalista

Formulários

Com esquemas para os elementos:

  1. Operações
    1. Botões de ação principal no topo, com evidencia para ação princial
  2. Formulário
    1. Geral
      1. Helps para campos
      2. Divisores de seções
      3. Disposição de campos
      4. Tabs
    2. Grids e CarLists
      1. Grids com muitas operações, incluindo buscas
      2. Grids com totalizadores
      3. Grids simples
    3. Anhamento
      1. Esquema de campos dentro de tabs