Criando um diagrama de arquitetura atraente, mas ainda técnico [fechado]

Alguém tem algum conselho para criar um diagrama de arquitetura de software "atraente"? Meu gerente me disse para tornar meu diagrama de arquitetura atual (que foi criado apenas usando o Visio e os ícones básicos) mais "atraente" para uma apresentação que tenho que oferecer a tipos de nível executivo que não são técnicos. Suponho que ele pretendia ter algo que você mostrasse aos clientes ou ao pessoal de marketing.

Algum conjunto de ícones específicos ou dicas específicas que as pessoas têm? Não posso postar meu diagrama atual por motivos de privacidade, mas para ter uma idéia geral, são apenas textos, linhas e ícones de servidor (http://www.227volts.com/wp-content/uploads/2009/03/exchange2007visiostencils.jpg) esse é o conjunto de ícones que estou usando.

Sinceramente, estou confuso sobre como tornar algo assim "mais atraente" (inferno, acho que preto e branco são sempre as melhores combinações de cores para usar: P)

Editar:

Então, algo assim http://rollerweblogger.org/roller/resource/linkedin-today.png ainda é considerado "profissional" com todas as cores e coisas assim?

Perguntei ao meu gerente e tudo o que ele disse foi apenas torná-lo mais comercializável, evitando perguntas sobre o que eu deveria fazer especificamente.

Esta pergunta é muito grande para ser respondida exatamente ponto a ponto. Existem livros sobre design e outros sobre a experiência do usuário , que explicam em todos os detalhes como tornar o software, produtos de consumo, livros, anúncios, brinquedos para bebês mais atraentes para o público-alvo. Na verdade, sua pergunta é semelhante a:

Sou designer, tenho alguma idéia de programação (aprendi Básico na escola por duas semanas), mas não tenho tempo para aprender programação. Me pediram para fazer um site de comércio eletrônico do zero usando o ASP.NET MVC e o Microsoft SQL. Você pode me explicar o que são essas duas coisas e como posso usá-las para fazer um trabalho bem-sucedido?

Em todos os casos, se você deseja criar gráficos "atraentes", mas não tem tempo para ler dezenas de livros e não possui um designer em sua empresa (é possível?), Tente se inspirar no que você vê por aí : sites profissionais, apresentações etc. Você precisa observar algumas regras e padrões e aplicá-los aos seus gráficos. Você pode errar algumas vezes, porque algumas regras funcionam bem em sites, mas falham em produtos de consumo, gráficos ou brinquedos para bebês, mas, em geral, você tem mais chances de ter sucesso.

Por exemplo, se eu pegar o gráfico em sua edição:

Percebo o primeiro erro: sombras. As sombras devem ser usadas com cautela. Em um site, esse uso seria inaceitável. Um bom exemplo de como as sombras devem ser usadas é o Apple.com . Cada elemento com o qual o usuário pode interagir possui uma pequena sombra, dando uma sensação de volume. Nenhum outro elemento tem sombra. No caso de um gráfico, isso pode ser mais aceitável, pois os usuários não pretendem interagir com o gráfico. Ainda assim, as sombras são muito grandes e muito separadas dos elementos. Além disso, aqui, não há necessidade deles: cada elemento já possui uma borda .

Regra geral: KISS (ou, se quiser, "seja preguiçoso"). Não adicione uma borda, sombra e cor de fundo ao mesmo tempo. Não deixe o texto em negrito e itálico Arial Black 200 vermelho sublinhado com uma borda amarela no fundo limão piscando. Faça apenas o que você precisa fazer para adicionar impacto visual, nada mais.

Pense em estilizar seus gráficos: ninguém deseja ver esses diagramas UML em preto e branco feios. Mas não exagere: apenas ficará pior: os diagramas em preto e branco da UML são feios, mas utilizáveis . Uma porcaria animada por GIF piscando com várias fontes e vários ícones e setas que mudam de cor não é apenas feia, mas também inutilizável.

Para os gráficos, lembre-se da especificidade do contexto. Se ele for mostrado através de um projetor, você não poderá ter um texto verde em fundo branco : ele desaparecerá magicamente quando projetado na parede. Se ele suporta sua palestra, não coloque muito em um slide : muitos gráficos, muitos números, muito texto. A ilustração acima é um bom exemplo do que você nunca deve fazer em uma apresentação: com esse slide, você tem certeza de que metade da platéia dorme e a outra metade para de ouvi-lo, tentando desesperadamente entender o que é isso. .

Por fim, lembre-se de que você está aqui para o seu público, não o contrário . Se você mostrar o gráfico como o ilustrado acima para o pessoal de marketing , eles dirão a si mesmos que você é péssimo. Eles sabem o que é a nuvem (ou acreditam que tem algo a ver com aplicativos hospedados no céu / espaço)? Eles sabem o que representa o ícone marrom com "DB" nele? Eles podem explicar o que é um aplicativo da Web e como ele é diferente de outro aplicativo ou de um site?

Provavelmente é desnecessário enfatizar que a beleza é uma das opiniões mais subjetivas de todos os tempos. Como se costuma dizer, a beleza está nos olhos de quem vê , então o que é belo para você pode ser feio como o inferno para outra pessoa. Muitas metades melhores concordariam.

Dito isto, hoje em dia as pessoas provavelmente esperam um pouco mais do que um diagrama ASCII. Você não precisa estudar a teoria das cores, mas modelá-la um pouco não fará mal. Sites para fazer diagramas como, por exemplo, Gliffy têm modelos de aparência decente que eu aposto, agradariam a qualquer um (ou pelo menos não desagradassem) participar dessa apresentação.

Depois de fazer seus diagramas usando as ferramentas de desenvolvimento que você normalmente usa, refaça-as do zero no Powerpoint ou em qualquer software de apresentação que sua empresa use. Minhas apresentações usando os ícones padrão e os estilos de seta obtiveram uma resposta muito melhor do que as que fiz no Enterprise Architect ou no Power Designer. Pule a UML e opte por diagramas de relacionamento e fluxogramas simples. Como em qualquer apresentação, junte algo rapidamente e passe pelo gerente para obter feedback. Você não quer perder horas elaborando um diagrama elaborado de fluxo de trabalho que seu gerente eliminará por estar "muito ocupado". Eu recomendo fazer um diagrama simples por completo, para que você possa mostrar o estilo (fonte, paleta de cores, layout) e zombar do restante do conteúdo.

Seja consistente na fonte. Afaste as coisas igualmente e mantenha-as alinhadas. Provavelmente adicione uma ou duas cores (cores da empresa?) Além do preto e branco. Cabeçalhos em negrito. As fronteiras devem ser distintas. Algo um pouco mais do que linhas de grade como plano de fundo ou nenhum.

Você pode ter que dividir em páginas / slides separados. Ninguém quer ver 57 blocos no diagrama caótico de um ninho de pássaro (pela percepção deles).

Você pode consultar alguém da sua empresa com um pouco mais de senso estético. Execute-o por alguém em vendas ou marketing.

Use cantos arredondados e cores suaves. Use linhas grossas. Elliance tem alguns bons exemplos. Não estou autorizado a postar imagens, mas aqui está um exemplo que usei como inspiração para meus próprios diagramas.