Hoje vou comentar um pouco sobre escopo e integração em projetos. Essas duas atividades são extremamente importantes para o sucesso de um bom projeto.

Vamos lá…

Integração

A  área   de   integração  na   gestão   de   projetos,   esta   diretamente relacionada à parte de levantamento de requisitos de um projeto e é utilizado no momento em que processos individuais precisam interagir entre si.

Por   isso,  no  inicio do projeto,  é  importante o gerente detalhar como será o desenvolvimento do mesmo e a sua  integração. É preciso definir   como   as   partes   irão   se   relacionar,   e   em  que   pontos   serão aplicados   maiores   esforços   de   forma   que   o   resultado   final   seja alcançado com sucesso.

Cabe ao gerente do projeto administrar possíveis mudanças, ser capaz de resolver conflitos e gerenciar fatores externos que venham a influenciar   o   andamento   do   projeto,   sempre   procurando  manter   os processos do projeto  integrados.  Esta etapa da gerencia de projetos define alguns produtos como descrito abaixo:

• Termo de abertura do projeto. (Autorização formal para o inicio)
• Declaração   preliminar   do   escopo   do   projeto.   (O   que   será abordado   ou   não   no   projeto.  Declaração   do   escopo   em  nível macro)
• Plano para o gerenciamento do projeto. (Documentação das ações que deverão ser tomadas para a execução do projeto como um todo)
• Controle de mudanças. (Gerenciar mudanças no projeto)
• Controle do trabalho do projeto. (Controle dos processos usados para iniciar, planejar, executar e encerrar o projeto)
• Encerramento do projeto.  (Finalização de todos os processos do projeto, finalização formal do projeto)

Também garante a  integração com elementos externos normais da empresa, caso haja.

Em suma, gerencia de integração é importante para garantir que todas   as   etapas   e   elementos   de   um  projeto   estejam  integrados   e coordenados.

Escopo

Como descrito no Guia PmBok¹,   resumidamente,  a gerencia de escopo é importante para garantir que todos os processos que fazem parte do projeto estejam  incluídos,  e  somente eles,  para  terminar  o projeto com sucesso, ou seja, descreve o que o projeto irá entregar e o que não irá entregar.

Nesta etapa é realizado o planejamento do escopo, definição do escopo, criação da EAP (ou WBS), verificação do escopo e controle do escopo. A EAP é acompanhada de um dicionário que a descreve. Todos os processos desta etapa interagem com outras áreas de conhecimento  abordadas no projeto.

Na   engenharia   de   software,   por   exemplo,   existe   a  UML,   que descreve de forma bastante objetiva o escopo de um sistema através do diagrama de casos de uso, ou use case, aonde é descrito como os atores interagem com partes do sistema, fazendo esses, parte da definição do escopo do projeto em questão.

Grande parte dos projetos que fracassam, é porque a equipe não investiu tempo suficiente definindo o projeto e/ou houve uma falha no momento da definição e gerenciamento de escopo.

Tomando este fato como base, fica evidente a importância de um bom gerenciamento de escopo em um projeto, seja ele de qual natureza for.

EAP ( Estrutura Analítica do Projeto )

Uma EAP é uma visão do escopo através de um diagrama. Nele é possível visualizar os produtos que serão entregues e seus pacotes de trabalho ( detalhamento de baixo nível ).

Exemplificando com uma estrutura genérica,  um deliverable  (ou entrega)  pode ser  dividido em pacotes de  trabalho.  Estes pacotes de trabalho   podem  ser   divididos   em  atividades,   e   posteriormente   em tarefas.

Para isso, é preciso identificar as entregas do 1º e 2º nível. Após isso é possível identificar com maior facilidade as tarefas, aumentando o grau de especificação.  Quanto maior o grau de detalhamento da EAP, maior será a confiabilidade das informações.

Este grau de detalhamento pode ser  feito dividindo as entregas em departamentos, ciclos de vida do projeto ou linha do tempo.

Para   cada  método   de   separação,   seria   feito   um  refinamento partindo como base a forma escolhida e sucessivamente, detalhando o projeto através de ramificações no diagrama.

Abaixo um exemplo de EAP para uma entrega.  Tem como base uma construção civil.

Este seria um exemplo de representação de um pacote de trabalho apenas, o da estrutura.

Em projetos grandes essa estrutura aumenta muito, por isso temos diversos softwares que nos auxiliam na criação da EAP, como o MSProject por exemplo.

[ ] ’ss

 1-Guia PMBOK – Um guia do conjunto de conhecimentos em gerenciamento de projetos – Terceira  edição

| | | | | | | | | | | | |

Olá amigos

Hoje irei iniciar uma série de artigos sobre Gestão de Projetos e Projetos de Software. Antes de qualquer coisa, é necessário entendermos alguns conceitos básicos de gerência de projetos e de software. Um projeto de software pode ser desenvolvido focado na metodologia RUP, PMBOK ou ambas.

Aqui cito uma breve descrição do que é a metodologia RUP, extraído da Wikipedia:

“O RUP, abreviação de Rational Unified Process (ou Processo Unificado da Rational), é um processo proprietário de Engenharia de software criado pela Rational Software Corporation, adquirida pela IBM, ganhando um novo nome IRUP que agora é uma abreviação de IBM Rational Unified Process e tornando-se uma brand na área de Software, fornecendo técnicas a serem seguidas pelos membros da equipe de desenvolvimento de software com o objetivo de aumentar a sua produtividade.”

As disciplinas do RUP são:

· Modelagem de Negócios

· Requisitos

· Análise e Design

· Implementação

· Teste

· Implantação

· Ambiente

· Gerenciamento de Projeto

· Gerenciamento de Configuração e Mudança

Essa metodologia sugere um fluxo de trabalho, aonde todas essas disciplinas seguem uma seqüencia, de forma a se alcançar os objetivos finais que são prazos respeitados, qualidade do software e cliente satisfeito.

Já o PMBOK (Project Management Body of Knowledge) é o conjunto de conhecimentos, ou disciplinas do PMI. O PMI
é a maior instituição sem fins lucrativos de gerência de projetos. Uma pequena descrição retirada da Wikipedia logo abaixo:

“Estabelecido em 1969 e situado nos arredores da Filadélfia, Pensilvânia, Estados Unidos, o Project Management Institute (PMI) – Instituto de Gerenciamento de Projeto– foi fundado por cinco voluntários. A comunidade americana da Pensilvânia emitiu artigos de empresas para PMI que resultaram na concretização oficial da organização. Durante aquele mesmo ano, o primeiro Simpósio e Seminário PMI foi realizado em Atlanta, Geórgia, Estados Unidos, obtendo uma audiência de 83 pessoas.”

Desde aquela época, o PMI cresceu muito e tornou-se uma referência em relação a metodologias e boas práticas para Gerência de Projetos.

Existem outras instituições de Gerencia de Projetos que valem a pena ser citadas, como o “Project Management Association of Japan“ (PMAJ – Instituição japonesa de GP) e a “Association for Project Management” , sendo essa ultima bastante utilizada na Europa.

Todas elas possuem seus BOK’s para gerencia de projeto.

No PMBOK ,são nove as disciplinas descritas:

· Gerência de integração de projetos

· Gerência de escopo de projetos

· Gerência de tempo de projetos

· Gerência de custo de projetos

· Gerência de qualidade de projetos

· Gerência de recursos humanos de projetos

· Gerência de comunicações de projetos

· Gerência de riscos de projetos

· Gerência de aquisições de projetos

Em um projeto de software, essas disciplinas do PMBOK podem ser associadas às do RUP, quando necessário, pois uma pode complementar a outra.

No próximo artigo irei abordar alguns pontos interessantes de como a Gerência de Integração, Gerência de escopo de Projeto, Modelagem de Negócios e Requisitos podem trabalhar juntos.

| | | | | | | | | | | | |

Hoje abordaremos um assunto importante, acessibilidade em formulários.
O que é acessibilidade segundo a W3C.
Link para referência http://www.w3.org/WAI/intro/accessibility.php
No site maujor temos acesso a este mesmo material em português.
Link para referência http://www.maujor.com/w3c/introwac.html
Segundo Nick Rigby criador desta técnica a vantagem de utilizarmos um formulário projetado desta forma. É a flexibilidade que ganhamos, podendo usar ele em vários projetos, mudando apenas a formatação, utilizando uma que se encaixe no layout do seu projeto.
A parte mais importante do nosso formulário é o html, para a construção dele usaremos as seguintes tags:
<fieldset>
<label>
<legend>
<ol>
<li>
<em>
Se você nunca utilizou estas tags, aconselho a ler a documentação da W3Schools.
Link para referência http://www.w3schools.com/tags/default.asp
Abaixo o nosso HTML 4.01 / XHTML 1.0.

<head>
<script src="lib/jquery-1.2.3.js" type="text/javascript"></script>
<script src="lib/cmxforms.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/screen.css" media="screen" type="text/css">
</head>
<form class="cmxform" action="#"> Campos de preenchimento obrigatório. Contém<em>*</em>
<fieldset>
<legend>Acessibilidade em Formulário</legend>
<ol>
<li> <label for="name">Nome<em>*</em></label>
<input id="name" type="text" /></li>
<li> <label for="age">Idade<em>*</em></label>
<input id="age" type="text" /></li>
<li> <label for="height">Altura<em>*</em></label>
<input id="height" type="text" /></li>
<li> <label for="weight">Peso<em>*</em></label>
<input id="weight" type="text" /></li>
<li> <label for="email">E-mail<em>*</em></label>
<input id="email" type="text" /></li>
<li> <fieldset>
<legend>Aceita os termos de responsabilidade?<em>*</em></legend>
<label>
<input name="condition" type="radio" value="yes" /> Sim</label>
<label>
<input name="condition" type="radio" value="no" /> Não</label>
</fieldset></li>
</ol>
</fieldset>
<fieldset>
<legend>Outras informações</legend>
<ol>
<li> <label for="dob">Data do aniversário
<span class="sr">(Dia)</span><em>*</em>
</label>
<select id="dob">
<option value="1">1</option>
<option value="2">2</option>
</select>
<label class="sr" for="dob-m">Data do aniversário (Mês)
<em>*</em>
</label>
<select id="dob-m">
<option value="1">Jan</option>
<option value="2">Feb</option>
</select>
<label class="sr" for="dob-y">Data do aniversário (Ano)
<em>*</em>
</label>
<select id="dob-y">
<option value="1984">1984</option>
<option value="1985">1985</option>
</select>
</li>
<li> <label for="sex">Sexo <em>*</em></label>
<select id="sex">
<option value="female">Feminino</option>
<option value="male">Masculino</option>
</select>
</li>
<li> 
<fieldset>
<legend>Qual esporte você prática?</legend>
<label for="football">
<input id="football" type="checkbox" /> Futebol</label>
<label for="golf">
<input id="golf" type="checkbox" /> Golfe</label>
<label for="volley">
<input id="volley" type="checkbox" /> Vôlei</label>
<label for="tennis">
<input id="tennis" type="checkbox" /> Tênis</label>
<label for="basketball">
<input id="basketball" type="checkbox" /> Basquete</label>
<label for="boxing">
<input id="boxing" type="checkbox" /> Boxe</label>
</fieldset>
</li>
<li>
<label for="comments">Comentário</label>
<textarea id="comments" cols="25" rows="7"></textarea></li>
</ol>
</fieldset>
</form>

Abaixo nosso screen.css com os imports.

@import "reset.css";
@import "core.css";
@import "cmxTpl.css";
@import "cmxform.css";

Não irei postar todos arquivos css para não tornar o post muito extenso.
Para o funcionamento do nosso formulário, trabalharemos com a biblioteca javascript jQuery.
Link para download jQuery
Para contornar o bug de navegadores da fundação mozilla, que não interpretam corretamente a propriedade do css display:inline utilizaremos um script para atribuir o valor display: -moz-inline-box as tags <label>
Nosso cmxforms.js

// apply inline-box only for mozilla
if( jQuery.browser.mozilla ) {
// do when DOM is ready
$( function() {
// search form, hide it, search labels to modify, filter classes nocmx and error
$( 'form.cmxform' ).hide().find( 'li>label:not(.nocmx):not(.error)' ).each( function() {
var $this = $(this);
var labelContent = $this.html();
var labelWidth = document.defaultView.getComputedStyle( this, '' ).getPropertyValue( 'width' );
// create block element with width of label
var labelSpan = $("<span>")
.css("display", "block")
.width(labelWidth)
.html(labelContent);
// change display to mozilla specific inline-box
$this.css("display", "-moz-inline-box")
// remove children
.empty()
// add span element
.append(labelSpan);
// show form again
}).end().show();
});
};

Mesmo script utilizado no Bassitance mudei apenas a regra seletora li>label:not(.nocmx):not(.error)
Navegadores testados:

Confira o resultado aqui

| | | | | | | | | | | | |

Este é o meu primeiro texto para o blog Qosmio Tech e quero apresentar alguns dos lugares que podem servir para a base estrutural de um projeto de design para web. Vale a pena conferir.

Web Design Inspiration
http://www.flickr.com/photos/splat/sets/981332/
Uma coleção de imagens de sites reunidos através do Flickr com os mais variados tipos de design para web. Uma excelente fonte de inspiração e conhecimento para quem trabalha com a internet.

Web Creme
http://www.webcreme.com/
Blog sempre atualizado com as telas de vários sites num formato criativo e rápido de visualização.

Blue Vertigo
http://www.bluevertigo.com.ar/bluevertigo.htm
Excelente site mantido por um grupo de hermanos argentinos reunindo links para fotografia, fontes, ilustrações, gráficos vetoriais, design gráfico e para web.

Web Design from Scratch
http://webdesignfromscratch.com/
Site mantido por Ben Hunt webdesigner com mais de 10 anos de experiência projetando sites. Neste local você encontra várias dicas e e-books com técnicas para desenvolver um site de maneira eficiente.

CSS Zen Garden
http://www.csszengarden.com
Um site que demonstra as possibilidades do uso de CSS com vários exemplos e técnicas que servem de inspiração para o desenvolvimento de sites. Convidando a adicionar exemplos.

Bannerblog
http://www.bannerblog.com.au/
Aqui você encontra o que existe de melhor e mais criativo em banners e publicidade on-line.

Browser Shots
http://browsershots.org/
Site de grande utilidade faz o teste em vários navegadores criado por Johann C. Rocholl. Ajuda muito e poupa tempo.

WebUrbanist
http://weburbanist.com/
Uma coletânea de artistas, cultura, design e arte urbana - apresentando de forma simples as manifestações da arte atual, entre outras curiosidades espalhadas pelo mundo é navegar para ver (ver para crer).

Revolução Etc
http://revolucao.etc.br/
Site muito bom mantido por Henrique C. Pereira especialista em design de interfaces, planejamento, arquitetura da informação e desenvolvimento para web. Com muitas dicas e artigos divertidos relacionados a WEB. Destaco o CSS Naked Day.

Terreblue
http://www.terrebleue.be/
Site utilizando flash e a galeria Tilt Viewer que provoca um efeito muito interessante nas apresentações tipo slide show.

Bom estas são as minhas sugestões de sites para colocar entre os favoritos.

| | | | | | | | | | | | |

Simples tutorial, ensinando a inserir conteúdo de modo assíncrono sem que ocorra recarregamento no restante da página.
Para isso usaremos a biblioteca javascript jQuery.
O jQuery tem suporte cross-browser, CSS 1 - 3 e o básico de Xpath.
Download e documentação no site oficial:
http://jquery.com
Exemplo:

 
<!-- Importa a Biblioteca do jQuery -->
<script src="http://www.qosmio.com.br/wp-admin/lib/jquery-1.2.3.js" type="text/javascript"><!--mce:0--></script>
<!-- Importa a nossa função -->
<script src="http://www.qosmio.com.br/wp-admin/lib/centralcontent.js" type="text/javascript"><!--mce:1--></script>
 
<!--[If lte IE 7]>
	<link type="text/css" href="css/ie.css" mce_href="http://www.qosmio.com.br/wp-admin/css/ie.css" rel="stylesheet" />
<![endif]-->
<div id="page">
<div id="back">
	<a title="Voltar ao anúncio">&lt;&lt; |</a></div>
<div id="menu">
<ul>
	<li>
<a id="content1" title="Home" href="#">Home</a></li>
	<li>
<a id="content2" title="A Empresa" href="#">A Empresa</a></li>
	<li>
<a id="content3" title="Portfólio" href="#">Portfólio</a></li>
	<li>
<a id="content4" title="Quem Somos" href="#">Quem Somos</a></li>
	<li>
<a id="content5" title="Fale Conosco" href="#">Fale Conosco</a></li>
</ul>
</div>
<div id="content">
&lt; p&gt;Exemplo de inserção de conteúdo sem carregar a página<!-- p--></div>
</div>

// Cria a variável mostrar
// A Qual receberá os seguintes parâmetros
// (url, conteudo, tempo, iniciar e show)
var mostrar = {
  $url:'', $conteudo:'', $tempo:'',
  //Iniciar recebe a nossa função
  iniciar: function() {
	// Nossa função sera executada quando
	// quando houver um click no bloco
	$('div#menu a').click(function(){
		// Variável url recebe o atributo id
		// do link do menu que for clicado
		//e concatena com a extensão html
		mostrar.$url = $(this).attr('id')+'.html';
		// Variável conteudo define onde será
		// exibido o bloco com o conteudo
		mostrar.$conteudo = $('div#content');
		// Variável conteudo recebe a tag img
		// E a escreve dentro do bloco do conteúdo
		mostrar.$conteudo.html
		('< img src="./img/ajax-loader.gif" />');
		// Define o tempo para exibição do conteúdo
		// Que foi definido para 2 segundos
		mostrar.$tempo = setTimeout('mostrar.show()', 2000);
	});
},
	// Cria a função para leitura do arquivo html
	show:function() {
	// Criamos o diretório includes e colocamos os
	//arquivos neste diretório
	mostrar.$conteudo.load('./includes/'+mostrar.$url)
	// Limpa o timeout
	clearTimeout(mostrar.$tempo);
	}
}
// Iniciamos a função
$(function(){
	mostrar.iniciar();
})

* {margin:0;padding:0;text-decoration:none;
  font-family:Georgia, Times, Times New Roman, serif;}
#page{width:700px;border:1px solid red;float:left;margin-left:20%;}
#back {
	  opacity:.50;filter: alpha(opacity=50);
	  -moz-opacity: 0.5;border:1px solid black;
	  background-color:blue;width:6%;height:5%;
	  line-height:1.8;float:right;margin:10px;padding:2px;
}
#menu{width:15%;padding:10px 0px 0px 10px;
	float:left;margin:10px;border:1px solid green;}
#content{border:1px solid yellow;width:70%;float:left;}
p{padding:10px;}
bdo{font-variant:small-caps;
	color:red;font-weight:bold;font-size:25px;}
span{font-weight:bold;margin:33%;}
ul li{list-style:none;}
a:link{color:#000;}
a:visited{color:#FF00FF;}
a:hover{text-decoration:underline overline;color:#CCC;}
a:active{color:#00FFFF;}

/*
Margin Left in ie 6
*/
#page{margin-left:10%;}

Confira o resultado aqui

| | | | | | | | | | | | |