andré.santana [webdesign blog]

Archive for the ‘Design’ Category

Manter em sua empresa uma boa equipe de profissionais eficientes e motivados não é muito diferente do que fazem os clubes de futebol – para exigir amor à camisa ofereça alguns benefícios em troca.

Não é novidade que a rotatividade dos profissionais de internet é alta. E qual seria o real motivo deste vai-e-vem do mercado? O aspecto financeiro motiva a saída de um profissional. O ambiente da alta rotatividade dentro da empresa também, o que não é novidade. A grande questão é como reduzir o êxodo em massa da sua empresa ou até praticamente zerar este fenômeno.

Com o mercado aquecido, as propostas de contratação aparecem para os bons profissionais e poucos fatores podem fazer um profissional desistir da sua saída. Isso mesmo, desistir, pois sabemos que o mercado funciona na maioria das vezes desta forma: antes de comunicar a saída, o profissional comunica a proposta recebida para, possivelmente, receber uma contra-proposta ainda mais motivadora.

Não vejo isto como algo ruim. Mostra muitas vezes que você tem do seu lado um bom profissional que outras empresas gostariam de somar em suas equipes. É um mundo muito parecido com o do futebol e a semelhança aumenta diante da ida de muitos bons profissionais brasileiros para outros países.

É claro que a comparação tem as suas particularidades, mesmo porque as cifras também são bem diferentes. Mas, assim como no futebol, é clara a necessidade de se formar bons times e não apenas equipes.

É muito importante buscar profissionais criativos, outros com um perfil de análise para colocar o projeto no chão e alertar os criativos na hora certa, um capitão para liderar e motivar internamente a equipe e chamar a responsabilidade e, claro, um bom técnico, com habilidade e desenvoltura para propor inovações e se comunicar com os clientes nos momentos bons e ruins de um projeto.

Parece brincadeira, porém no fundo os times bem sucedidos têm essa fórmula nada mágica, mas realista.

Um bom time precisa estar bem entrosado. Os profissionais devem estar em sintonia, ter um espírito empreendedor, conseguir enxergar além do óbvio, ou, em muitos casos, enxergar pelo menos o óbvio, coisa que não acontece em muitas equipes.

Os times devem ser formados por profissionais com raça, brilho nos olhos, concentrados, que não olham o dia todo para o relógio contando as horas para o dia acabar. Um bom time cria um vínculo de amizade e as difíceis horas extra tornam-se descontraídas e produtivas. Os profissionais que formam bons times sabem a hora de cobrir o outro e carregar responsabilidades que nem sempre são deles. O velho ditado de “uma mão lava a outra” é comum em bons times.

Além disso, duas palavras são muito importantes para se formar bons times: liberdade e liberdade. O profissional tem que sentir que a empresa é parte da equipe, que sabe cobrí-lo quando necessário, até como forma de reconhecimento das vezes em que ele segura “rojões” para a empresa.

Com bons profissionais, que trabalham em sintonia dentro de um time e falam a mesma língua da empresa, a liberdade tende a somar para a produtividade, criatividade e uma duradoura relação entre o profissional e a empresa.

Outro ponto importante é o reconhecimento financeiro, com bônus e reajustes salariais antes das inesperadas e indesejadas propostas, para antecipar aquele momento em que o profissional pede uma conversa reservada, onde nem sempre sabe como justificar o que deseja. Não descuidar deste aspecto pode deixar a empresa na frente na corrida pelo bom profissional.

Estes fatores podem contribuir muito para, ao menos, minimizar a rotatividade dos seus times de trabalho. A combinação destes fatores insere o profissional em um ambiente prazeiroso para desenvolver um bom trabalho, que passa a pensar e a pesar se é mesmo uma boa escolha quebrar sua rotina em um bom ambiente para arriscar algo novo.

Não é uma tarefa fácil para o líder formar um bom time, quando muitos dos bons profissionais já estão em bons times. É como garimpar: demora muito encontrar os profissionais que irão compor o seu time de sucesso. É uma tarefa que não tem fim, mas muito compensadora quando se consegue montar um excelente time.

Por Rafael Cichini

Anúncios

Adobe Flash CS3

A maior habilidade de quem trabalha com Flash é desenvolver um filme bem produzido, com um SWF muito enxuto. Existem várias estratégias que, em conjunto, deixam o seu SWF o mais enxuto possível. Veremos algumas dicas para otimizar seu filme:

  • Não use formas simples (primitivas), procure sempre agrupar as formas. Transforme tudo que for usar mais de uma vez no filme, em símbolos (gráficos, MC e Buttons). Assim é possível uma grande redução. Não faça dois botões que apenas mudem a posição (sobe e desce). Simplesmente use o mesmo símbolo para representar os sentidos com rotação para cada instância. Quando você cria um MovieClip, ele fica na biblioteca de seu filme e o Flash incorpora todos os cálculos vetoriais no SWF final, e cada vez que você usa uma instância desse MovieClip, o Flash apenas “linka” para o item da biblioteca, deixando seu filme mais leve.
  • Importe com o tamanho já finalizado todas as imagens que usar em seu filme. Nunca reescale uma imagem dentro do Flash pois o tamanho em Kbytes continuará o mesmo. Procure sempre deixar as imagens com compactação, mesmo que seja leve. Faça o tratamento de sua imagem fora do Flash, e deixe a resolução até 72 dpi. Acima disso é desperdício, pois não é percebido nos monitores.
  • Sempre que puder, substitua uma imagem por uma forma em vetor. Bitmaps contém muitos Kbytes de informação e aumentam bastante o tamanho do SWF.
  • Nunca “quebre” (converter em curvas) um texto, com raras exceções. Principalmente fontes com muitos detalhes. O vetor final ficará muito complexo e pesado. Na maioria dos casos, o ideal é incluir a fonte em seu SWF. Porém use com cautela. Sempre que usar fontes simples como Arial, Courier ou Times New Roman, procure sempre usar as fontes de dispositivos (_sans, _serif e _typewriter) pois não são incorporadas ao filme.
  • Sempre que tiver um vetor muito complexo, com muitos detalhes, curvas e nós, faça uma limpeza suavizando bordas e eliminando detalhes desnecessários. Quanto mais nós em uma forma, mais pesado fica seu SWF.
  • Reduza ao máximo o uso de sons. Quando necessário, use o formato MP3 e altere o modo de exportação na biblioteca, para o menor tamanho possível, desde que também não comprometa a qualidade mínima aceitável.
  • Sempre que possível, utilize o carregamento dinâmico de imagens, sons e vídeo, carregando-os externamente. Assim é possível reduzir consideravelmente o tamanho de um filme, pois os elementos serão carregados durante a navegação do usuário, evitando um preload demorado.
  • Evite, sempre que possível, o uso de gradientes (degradé). Sendo inevitável, use o menor número de cores que puder.
  • Evite usar Twenning Motion e Shape (principalmente) no filme. Desde que seja possível, troque esses recursos por Action Script, que além de mais flexível e rápido, possibilita uma redução considerável no tamanho do SWF, pois a animação é executada durante a execução do SWF (run-time). Você poderá, inclusive, criar efeitos que interajam com o internauta e não simples animações pré-definidas.
  • Procure usar a ferramenta Ímã (Snap to Objects) para unir todos os pontos de um objeto, pois se estes ficarem separados (abertos), o Flash tem mais trabalho na execução, tendo que fazer vários cálculos desnecessários.
  • Reduza o número de frames desnecessários no filme. Em vários filmes são esquecidos frames inúteis. Além de aumentar o tamanho do arquivo FLA, pode comprometer o processamento do filme e tamanho do SWF também.
  • Analise seu código Action Script e, se houver duplicações, crie funções para executá-las, principalmente quando houver grande quantidade de comandos. Lembre-se sempre que, quanto mais elementos existirem no seu filme, tão maior seu tamanho será.
  • Evite usar “Break apart” em imagens ou use com muito cuidado, pois em muitos casos o tamanho do arquivo acaba ficando maior que a imagem original, mesmo que se elimine as partes desnecessárias da imagem. Isto em função principalmente do número de pixels selecionado. Ao invés disso, faça os devidos cortes em um programa de imagem e importe a imagem já finalizada.
  • Faça filmes objetivos que tenham ligação direta com o site. Muitos desenvolvedores esquecem que o internauta, geralmente, busca informações e não quer perder tempo carregando coisas inúteis, por mais “legais” que possam parecer.
  • Evite animar tudo que existe no filme. Movimentos só devem ser usados, nos itens realmente úteis e que precisam chamar a atenção ou sejam parte fundamental do contexto de seu site.
  • Faça uma limpeza na biblioteca do Fla, eliminando tudo o que não foi usado no filme. Para facilitar, o Flash tem uma função na biblioteca que seleciona automaticamente os itens que não estão sendo utilizados em seu filme. Use a função para destacar os itens e exclua. As versões mais recentes do Flash ignoram automaticamente os itens não utilizados.
  • Divida seu filme principal (SWF) em filmes menores (vários SWF) e chame-os somente quando necessário. Isto agiliza o carregamento, diminui o tamanho da animação e só exibe o que o visitante desejar. Isto possibilita uma perfeita manutenção, agilização e redução no tamanho dos seus filmes.
  • Cuidado com o uso de variáveis. É muito comum para os iniciantes, usar variável para tudo e incluir diversas variáveis para fazer coisas semelhantes que seriam possíveis com a utilização de uma única. Isto é possível com um maior conhecimento de programação. Sempre que não necessitar usar novamente uma variável, delete-a para reduzir o “consumo” de memória RAM do micro. Um número elevado de variáveis pode travar o micro. Isto dependerá, é claro, da configuração de cada equipamento, recursos disponíveis, consumo da memória por programas rodando simultaneamente na máquina e complexidade de seu filme.
  • O Flash possui uma ferramenta poderosa chamada Shared Libraries. Você pode ter uma única biblioteca com elementos que você vá utilizar repetidamente em vários filmes. Cada filme fará um link do objeto para essa biblioteca compartilhada. Esse método é extremamente eficiente ao se trabalhar com fontes, botões, etc, e caso você precise alterar algum elemento, fará apenas uma vez, na biblioteca principal. Leia a documentação do Flash para saber como usar melhor essa ferramenta.
  • Textos escritos como comentários no FLA, não são incluídos no arquivo final SWF, isso porque ele tem por finalidade auxiliar a documentação do código e facilitar sua compreensão posterior. Não se preocupe com isso.
  • Aproveite sempre os efeitos das versões mais recentes. Sempre que precisar usar sombras, efeitos de blur, glow ou blending mode, ao invés de usar bitmaps para isso. Ainda há a vantagem de animar estes efeitos.

É isso aí pessoal. Com esse “pacote” de dicas é possível construir bases de sites completos em Flash com até míseros 60Kb, aproveitando ao máximo a otimização do SWF.

Espero que tenham gostado. Até a próxima!

por Arthur Paredes

Tags: , , ,

Salve, salve fiéis leitores, tudo bem com vocês?

Enfim, aconteceu nesta última segunda (07/04) e terça-feira (08/04) o 2º Seminário de Criação Publicitária na cidade de Natal/RN, que por sinal – pra quem não sabe – é minha cidade natal. Entenderam o trocadilho? hehehe:P

Baboseiras a parte, foi muito bom. Parabéns para a Staff de Comunicação pela iniciativa, que venham mais eventos como esse, palmas também para o Sinapro/RN, na pessoa de Arturo Arruda Câmara que apoiou o projeto, a todos os patrocinadores e também a todos que apoiaram e acreditaram no evento. Saibam que o seminário foi de um proveito imenso para todos que participaram do seminário. Vocês não tem idéia de como o horizonte de cada abriu, com o mundo de informação e referências que vocês no propocionaram. Mais uma vez parabéns, fazia tempo que eu não participava de um evento desse porte.

Palestrando para nós tivemos nada mais, nada menos do que Carlos Henrique Equi (Staff/RJ), Flávio Medeiros (Presidente do CCRJ), Álvaro Rodrigues (Agência3/RJ) e por último – mas não menos importante – Pedro Porto (Santa Clara/SP).

Sentiu o gostinho? Pois é, em setembro tem mais! =)

por André Santana

Post muito legal, vale a pena ver. Via Stuff That Happens

Ouch!

simplicity

Clique na imagem para ampliar

=)

Comentem…

Para o design ter sucesso, ele deve primeiro atender as necessidades básicas das pessoas – antes de tentar satisfazer necessidades de níveis mais altos.

E quais seriam estas necessidades? Para chegar aos cinco elementos chave na hierarquia das necessidades no design, vamos seguir o padrão de Maslow:

maslow

Necessidades humanas segundo Maslow

1. Fisiológicas
2. Segurança
3. Relacionamento
4. Estima/Status
5. Realização pessoal

Necessidades do Design

1. Funcionalidade
2. Confiabilidade
3. Usabilidade
4. Proficiência
5. Criatividade

Funcionalidade

Fisiologia: significa atender os requisitos mais básicos do design. Exemplo: um aparelho de DVD deve, pelo menos, ser capaz de gravar e reproduzir vídeos.

Valor agregado pelo design é muito baixo.

Estabilidade

Segurança: significa estabelecer uma performance estável e consistente. Exemplo: um aparelho de DVD deve reproduzir vídeos com qualidade e o mecanismo (software/hardware) não deve apresentar defeitos.

Valor agregado pelo design é baixo.

Usabilidade

Relacionamento: significa disponibilizar uma interface simples, fácil de ser usada e que perdoe erros do usuário. Exemplo: programar um aparelho de DVD para começar a gravar um filme a uma determinada hora deve ser fácil e o sistema deve ser tolerante em relação a erros cometidos pelo usuário.

Valor agregado pelo design é moderado.

Proficiência

Estima: significa disponibilizar recursos para melhorar o modo como os usuários fazem as coisas. Exemplo: um aparelho de DVD que consiga pesquisar e gravar programas baseado em palavras chave escolhidas pelo usuário.

Valor agregado pelo design é alto.

Criatividade

Realização pessoal: é o nível na hierarquia onde todas as necessidades foram atendidas e onde as pessoas começam a interagir com o design de formas inovadoras. O design passa a ser usado para criar e explorar áreas que estendam a experiência do usuário.

Valor agregado pelo design é muito alto.

De acordo com a teoria de Maslow, as necessidades fisiológicas, as necessidades de segurança e algumas das necessidades sociais (funcionalidade, confiabilidade e usabilidade se aplicado ao design) são fatores de desmotivação. A teoria diz que a satisfação destas necessidades é básica; já a ausência da satisfação destas necessidades não motiva ninguém, pelo contrário, desmotiva.

Já as necessidades sociais, as necessidades de “status” e de estima e as necessidades de auto-realização são fortes fatores motivacionais. Ou seja, se não forem atendidas, as pessoas procuram fazer com que sejam satisfeitas; as pessoas são motivadas a alcançar a satisfação destas necessidades.

Quando se fala em design agregando valor a algum produto, serviço ou interface é preciso ter a clareza que ele terá o efeito desejado quando passar a atender os níveis mais altos da pirâmide (proficiência e criatividade).

Mas até chegar a estes níveis, os primeiros devem necessariamente ser atendidos.

por Marcos Nähr

Entrando em um endereço na internet, você saberia dizer se é um site ou um aplicativo? Qual a diferença entre um e outro? E por que desenvolvedores de aplicativos não trabalham mais sem o auxílio de um designer?

Salvo exceção, você desenvolvedor já foi chamado por um cliente com o seguinte pedido:

“Quero que você desenvolva um aplicativo para mim, que funcione na internet, e que permita publicação, votação e comentários em artigos”.

Designers também costumam ouvir algo do tipo:

“quero que você faça um site para mim. Esse site tem que publicar artigos, permitir que os visitantes votem no melhor e também façam comentários”.

Tendo em vista o que seu cliente pede, você que é desenvolvedor, entrega um site ou um aplicativo?

Responda rápido, se for capaz. Identifique nas 10 alternativas abaixo, quais são sites e quais são aplicativos:

Se você respondeu que os dez são sites, ganhou nota 5. Se você respondeu que os dez são aplicativos, também ganhou nota 5. Mas se você respondeu que os dez são um misto de site e aplicativo, ganhou nota 10.

É isso mesmo. A diferença entre um e outro está cada vez menor e os conceitos estão mais confusos, mas vamos tentar esclarecer um pouco. Com o surgimento da web 2.0, então, o abismo de antes virou uma valeta rasa. Para encurtar o assunto, praticamente todos os sites que usamos hoje têm, por trás, aplicativos que o fazem funcionar.

Vamos tomar como exemplo um prato self-service da internet: um blog. Quando falamos em “criar um blog”, estamos usando vários programas que recebem o que você escreveu, gravam os dados no banco de dados, mostram em ordem descrescente de postagem, filtram por categorias, etc.

Concorda que são programas? E concorda também que um conjunto de programas forma um aplicativo (ou sistema, no jargão da minha época)?

Quando você instala um plugin num blog, você está inserindo um novo programa ao aplicativo já existente, não é mesmo? A questão é que isso tudo melhorou tanto, que esses detalhes técnicos passam despercebidos por nós, a maioria do tempo. Mas continua sendo um conjunto de programas (um aplicativo).

Então vem a pergunta: é um site ou um aplicativo?

A diferença está no que o visitante do site (que usa o aplicativo) percebe e o que o seu cliente (que paga pelo site) determina. O ideal é que o visitante do site (que usa o aplicativo) tenha a sensação de estar usando um site e que seu cliente (que paga pelo site) tenha a oportunidade de definir todas as regras do aplicativo; por mais óbvias que sejam.

Não entendeu direito? Vamos analisar as duas visões aparentemente antagônicas.

Se você lançar um aplicativo na internet, provavelmente ninguém vai querer usá-lo. Aplicativos são conhecidos por serem complicados, precisarem de manual e treinamento. Ou ambos. Cada aplicativo tem um visual diferente. Já um site é outra coisa. Bem melhor! A simples possibilidade de usar um serviço baseado no browser dispensa até treinamento. Quer um exemplo? As suites online de escritório: Google Documents, Editgrid, Zoho, etc. Você precisou de treinamento para usar esses sites (aplicativos)?

Para uma empresa, que vantagem, hein! Além do gerenciamento centralizado, temos uma interface comum que qualquer pessoa está acostumada a ver num webmail, grupo de discussão ou portal de notícias. Isso é ter a sensação de usar um site. O que fala mais alto aqui é o lado psicológico de quem usa.

Por outro lado, toda essa simplicidade aparente não descarta a necessidade de regras, validações, projeto de banco de dados, segurança, log de erros, etc. Isso tudo faz parte do projeto de um aplicativo, certo?

Então, vem novamente a pergunta: é um site ou um aplicativo?

Você, como desenvolvedor, continua fazendo programas que recebem dados, faz a validação dos campos, grava ou busca informações numa base de dados e entrega uma resposta. Igualzinho como fazia em aplicações desktop ou centralizadas. O que mudou foi a forma de apresentar o resultado ao visitante (que usa o aplicativo).

Por esse motivo é que nós, que somos desenvolvedores de aplicativos, não conseguimos mais trabalhar sozinhos sem um designer para dar aquele visual de site ao nosso aplicativo.

Ou, como diriam os designers, não seria possível entregar o site sem o programador para inserir todas as regras de funcionamento e processamento dele. Um não vive mais sem o outro.

E é muito bom que seja assim. Esse é o motivo da enxurrada de frameworks e técnicas para separar a lógica de negócio da apresentação dos dados. Como podemos dizer no popular, “cada macaco no seu galho”.

Portanto, para o visitante (que usa o aplicativo), deixe o designer apresentar um site. Ele se sentirá bastante à vontade. Afinal, um site é fácil de usar e bonito de se ver.

Mas para o cliente que pediu o site (e que paga pelo seu serviço) desenvolva um aplicativo. É esse cliente quem vai definir aquele monte de regras, que perfil de usuário pode fazer o quê, qual a política de segurança, qual a complexidade das interações, aprovar seu modelo de informações, pagar pelo seu serviço, etc.

Tenho certeza que ambos ficarão felizes com a simplicidade do site e o controle do aplicativo. Cada qual com seu pedaço. E você, com um bom case em seu portifólio.

por Vinicius Assef

mala-dinheiro

Definir o preço de um projeto gráfico, para web, muitas vezes é o passo mais difícil na montagem de uma proposta comercial.

Neste artigo, espero esclarecer algumas dúvidas apresentando uma metodologia de cálculo de honorários a partir dos custos dos serviços.

Em virtude da profissão “designer” não ser regulamentada no Brasil, não existem diretrizes oficiais que determinam preços e pisos salariais.

Entretanto, existem associações profissionais como a ADG (Associação dos Designers Gráficos do Brasil) que estipula parâmetros de valores para horas técnicas de trabalho (homem/hora ou h/h) e para serviços gráficos em geral.

A primeira coisa que devemos saber quando pensamos em um orçamento, é que existem dois tipos de custo, o custo direto e o custo indireto.

Custo Direto

É resultante do valor da mão-de-obra somado a outros custos diretos, ou seja, outros custos relacionados diretamente ao projeto específico (impressões, fotografias, transporte, materiais de escritório consumidos, programação…)

A mão-de-obra é resultante do total de horas de trabalho no projeto multiplicado pelo valor do homem/hora.mão-de-obra = horas de trabalho x valor do homem/hora

Para calcular o h/h, primeiro devo ter em mente qual a remuneração mensal do profissional e dividí-la por 175, que corresponde a quantidade de horas trabalhadas no mês (considerando que o profissional trabalhe nos 5 dias úteis da semana, 8 horas por dia) ou devo ter um valor fixo previamente estipulado por hora.

1 h/h = salário mensal / 175

Com a soma do valor total da mão-de-obra do(s) profissional(ais) (MdO) e dos outros custos diretos(O), temos o valor do custo direto (CD)

CD = MdO + O

Custo Indireto

São os custos que não estão diretamente relacionados com o serviço, mas são indispensáveis para a manutenção, infra-estrutura e divulgação do escritório.

O cálculo parte de um índice de custos indiretos (ii) no qual deve ser considerado o total de custos indiretos (CI) divididos pelo total de custos com a mão-de-obra (MdO). Índice de custos indiretos baixos é sinônimo de eficácia e produtividade e aumentam a competitividade. O ideal é que o ii não ultrapasse 0,5, ou seja, 50%.ii = CI / MdO ~= 0,5

Para calcular o custo indireto do projeto, devemos multiplicar o índice de custos indiretos pelo total da mão-de-obra.

CI = ii x MdO

Lucro

Lucro (L) é uma porcentagem aplicada sobre o total de custos. Para calcular o total de custos (C), devemos somar o custo direto (CD) ao custo indireto (CI).

C = CD + CI

Com a definição do valor do custo, multiplicamos por uma determinada porcentagem (X %) para obter o valor do lucro.

L = C x X%

Preço Parcial

Com a soma do custo indireto (CI) ao custo direto (CD) com o lucro (L), temos o preço parcial (PP) que ainda deve ser acrescido de impostos.

PP = (CI + CD) + L

mpostos

Os impostos a serem incluídos no valor final do projeto, variam de acordo com a situação legal de cada profissional.

Se o profissional for autônomo, temos o ISS (em SP de 5%) e o INSS (11% do pró-labore e o contratante deve pagar mais 20% do valor). Se for Pessoa Jurídica do tipo Ltda., temos o ISS, PIS, COFINS, IRPJ e o CSLL (juntos totalizam aproximadamente 17,33%) e o INSS (11% do pró-labore). Se for Pessoa Jurídica do tipo ME, temos o SIMPLES FEDERAL (a partir de 5,5%) e o INSS (11% do pró-labore).

Preço Final

É o preço a ser apresentado para o cliente (P). É a soma do preço parcial (PP) e dos impostos.

P = PP + Impostos

por Marcos Paes de Barros


Seja Bem-Vindo!

@andrehsantana

outubro 2017
S T Q Q S S D
« abr    
 1
2345678
9101112131415
16171819202122
23242526272829
3031  

RSS Feeds Deliciosos

  • Ocorreu um erro. É provável que o feed esteja indisponível. Tente mais tarde.

Blog Stats

  • 240,327 hits