1

Escola Básica e Secundária de Salvaterra de Magos

RELATÓRIO

Prova de Aptidão Profissional

LookMyClothes

Rodrigo Cerquinha

Curso Profissional Técnico de Multimédia

12ºG Nº23

2

Escola Básica e Secundária de Salvaterra de Magos

Rodrigo Cerquinha

Curso Profissional Técnico de Multimédia

12ºG Nº23

SUMÁRIO

Relatório das actividades do Projecto

LookMyClothe, desenvolvido como requisito parcial

dos módulos curriculares, supervisionado pelos Prof.

António Andrade, Alice Perira e Teresa Fazenda, no

curso Profissional Técnico de Multimédia.

Salvaterra de Magos

Julho de 2016

3

Agradecimenos

Não posso deixar de agradecer a algumas pessoas que, direta ou indiretamente,

me ajudaram neste percurso para a minha vida profissional e, também, pessoal.

Agradeço, aqui, à empresa Lusosoft e a todo o pessoal, mas mais

especificamente ao Luís Vaz por me ter aceitado para estagiar na sua empresa e ao

Mário Constantino por se ter empenhado em me ensinar C# (linguagem de

programação), em me ajudar em todas as tarefas que me deu e pela grande orientação,

sem eles nada do que aprendi seria possível.

Aos professores da Escola Secundária de Salvaterra de Magos por me terem

criado todas as condições necessárias para estes três anos de curso e me terem

disponibilizado um computador com uma conta própria para poder construir este projeto

(P.A.P.), pois fiquei sem computador em casa e sem a escola era praticamente

impossível de ter tudo feito.

4

Índice

Agradecimenos .............................................................................................................................. 3

Resumo.......................................................................................................................................... 5

Introdução ..................................................................................................................................... 6

Softwares utilizados ...................................................................................................................... 7

Disciplinas importantes para a realização do projeto .................................................................... 8

O Nascer da Rede Social ............................................................................................................... 9

Anteprojeto.................................................................................................................................. 10

Gantt Project ............................................................................................................................... 10

Briefing ....................................................................................................................................... 10

Eleição do Nome ......................................................................................................................... 11

Logótipo ...................................................................................................................................... 12

Construção .............................................................................................................................. 12

Cor ........................................................................................................................................... 12

Rede Social ................................................................................................................................. 13

Aplicação Móvel ................................................................................................................. 13

Conclusão .................................................................................................................................... 15

Anexos ......................................................................................................................................... 17

Primeiros Estudos de Layout ............................................................................................... 17

............................................................................................................................................. 18

Segundos Estudos de Layout....................................................................................................... 22

Terceiros Estudos de Layout ....................................................................................................... 25

Modelo Gantt ...................................................................................................................... 26

5

Resumo

O nosso Projeto de Aptidão Profissional é uma rede social de partilha de roupa.

Desenvolvemos uma aplicação para Android, onde as pessoas se podem registar e a

partir dai partilhar fotos com os amigos. Quando o utilizador partilha mais que uma foto

o sistema cria um sistema de votação para os amigos escolherem qual das peças de

roupas gostam mais.

6

Introdução

No âmbito da Prova de Aptidão Profissional, explorei um tema que na minha

opinião conecta todo o mundo. A este tema associei os meus conhecimentos de

aprendizagem adquiridos no Formação em Contexto de Trabalho, realizado na empresa

Lusosoft, e por mim mesmo, pesquisando.

A Prova de Aptidão Profissional tem o nome de LookMyClothes, sendo este o

nome da minha rede social.

A Rede Social surgiu com o propósito de querer criar algo que possa ser usado

por todo o mundo, através de um smartphone com o sistema operativo Android.

Todo este projeto surgiu, quando senti a necessidade de criar algo inovador e

que ainda não fora apresentado em mais nenhuma P.A.P. e que não existisse ainda.

O estágio, que realizei na Lusosoft, possibilitou-me avançar na realização do

projeto, tendo sido possível, perante as dificuldades surgidas, esclarecê-las com

profissionais da área, mais especificamente, pelo programador e grande pessoa, Mário

Constantino.

O projeto baseou-se na construção de uma rede social, passando pelas várias

fases de construção como a elaboração de um logótipo próprio, desenvolvimento de

uma aplicação móvel para sistemas operacionais Android e desenvolvimento de um site,

básico, onde visa mostrar e promover o produto.

Inicialmente esbocei todo o processo de construção com a utilização do

programa Gantt Project, realizei um plano de trabalho, permitindo-me uma melhor

organização e planificação do projeto.

Na elaboração da prova de aptidão profissional utilizei um software ensinado no

decorrer da formação em contexto de trabalho e no curso: Adobe Photoshop C5.1, o

Visual Studio Community 2015, o Microsoft SQL Server 2012 e o Sublime Text 3.

7

Softwares utilizados

Para a realização da Prova de Aptidão Profissional, utilizei o Adobe Photoshop

CS5.1 na criação dos estudos de layout, onde criei vários layouts tanto para a aplicação

móvel como para o website, usei o Gantt Project para distribuir as tarefas por etapas,

permitindo-me estar organizado e ter tudo planeado como deve ser.

Para construir a aplicação móvel Android, utilizei o Xamarin com integração no

Visual Studio Community 2015, que permite programar, tanto para Android como para

iOS, em C#, em vez da linguagem nativa de cada um. Logo, a linguagem que usei para

a realização da aplicação móvel foi C#, que é uma linguagem de programação orientada

a objetos que foi desenvolvida pela Microsoft como parte da plataforma .NET. A sua

sintaxe orientada a objetos foi baseada no C++, mas inclui muitas influências de outras

linguagens de programação, como Pascal e Java.

Como se trata de uma rede social necessita de uma base de dados, e para isso

usei o Microsoft SQL Server 2012, onde guardei a minha base de dados com os dados

dos utilizadores.

Por último, utilizei, para a construção do website de apresentação e divulgação

da rede social, o Sublime Text 3. Programei o site em HTML (Hyper Text Markup

Language), que é uma linguagem de marcação utilizada para produzir páginas na Web,

e para construir a interface gráfica, ou melhor dizendo, para enquadrar estéticamente o

site, como é óbvio, programei em CSS (Cascading Style Sheets), que é uma linguagem

de “folhas de estilo”, utilizada para definir a apresentação de documentos escritos nas

linguagens de marcação, como HTML ou XML.

8

Disciplinas importantes para a realização do projeto

Ao longo dos três anos de curso, houve disciplinas, de entre todas, duas que,

essencialmente, me permitiram realizar o meu projeto, que desenvolvi, principalmente

durante o último ano letivo, mas que teve início já no fim do 10º ano.

Essas disciplinas foram Sistemas de Informação (S.I.), onde comecei a aprender

programação web, HTML, CSS e JavaScript, e Preparação Projeto Multimédia (PPM),

onde pude desenvolver a minha aplicação, visto ter ficado sem computador, e sem esta

disciplina, muito dificilmente teria conseguido concluir o projeto.

A formação em contexto de trabalho permitiu-me, acima de tudo, aprender uma

nova linguagem de programação (C#), completamente diferente de tudo o que já tinha

feito orientada a objetos e dedicada à construção de sofwares. Aprendi, também, a usar

o Visual Studio, que foi sem dúvida uma mais-valia para o desenvolvimento de todo

este projeto.

9

O Nascer da Rede Social

A ideia nasceu da necessidade de criar um projeto para final de ano do curso e

do querer criar algo que pudesse ser usado por todo o mundo.

O produto é uma rede social, na qual as pessoas vão poder partilhar as suas

roupas e pedir a opinião dos seus seguidores em tempo real.

O nome LookMyClothes surgiu após a ideia e procura de um domínio com vaga.

A palavra Look, traduzida para português, significa olhar, a palavra My significa

meu/minha e a palavra Clothes significa roupas, tudo junto pode-se ler "Olha Para as

Minhas Roupas".

O nome da rede social está em inglês, pois permite alcançar o mercado

internacional e ter a compreensão de um maior número de utilizadores, sendo que a

língua mais falada no mundo é inglesa, e sendo o nome, também, fácil de compreensão,

não é preciso ser-se um génio em inglês para saber o seu significado.

Com a minha rede social, pretendo ter como público todos aqueles que têm um

smartphone com o sistema operativo Android, abrangendo todas as faixas etárias e todo

o género de pessoas.

Sendo uma rede social, é de notar, que nunca existirá uma versão final, pois há

sempre ideias a aparecer e existe sempre algo que se pode mudar alterar e melhorar.

10

Anteprojeto

O anteprojeto consistia no pré-plano da prova de aptidão profissional, no

ficheiro apresentei o tema, uma descrição sumativa e os objetivos que me propus

alcançar na realização.

Tive como principais objetivos, dos que referi, a colocação do projeto online,

fazer uma aplicação móvel, fazer um website, criar uma nova rede social, que ainda não

existisse e a possibilidade de me abrir portas no futuro da programação.

O anteprojeto pode ser consultado nos anexos onde apresentei o ficheiro

completo com todos os pormenores que implementei no início de todo este projeto.

Gantt Project

O Gantt Project inclui um diagrama com a calendarização das tarefas e recursos.

Possibilitando-me, assim, planificar o meu tempo para a realização de cada trabalho.

Briefing

No dia 22 de Setembro de 2015 dei início ao projeto e comecei a Investigação.

Nesta fase deu-se a pesquisa de informação. Procurei conteúdo e informações existentes

para analisar o que poderia fazer de novo.

Após a investigação, passei para a Ideia, decidi que iria fazer uma rede social

onde se partilhava roupa para pedir a opinião dos amigos.

No dia seguinte, 23 de setembro de 2015, ao voltar a trabalhar deparei-me com

um problema. Como haveria de "educar" os utilizadores que a rede social serviria para

partilhar roupa?

Depois de pensar muito em maneiras de resolver o problema, cheguei à conclusão que

no site iria ter que expor o conceito da rede, informando assim os utilizadores sobre o

funcionamento.

11

Eleição do Nome

Sendo uma rede social e o objetivo ser utilizada pelo mundo todo, o nome teria,

quase que obrigatório, de ser em inglês. Assim sendo fui procurar domínios disponíveis,

em http://www.dominios.pt, para não ter problemas com direitos de autor.

Inicialmente queria que se chamasse MyClothes, mas já estava a ser usado, por

isso, e não saindo do estilo de nome, simplesmente acrescentei Look, ficando

LookMyClothes.

Como expliquei anteriormente o nome da rede social permite alcançar o

mercado internacional e ter a compreensão de uma maioria, sendo fácil de compreensão.

12

Logótipo

Construção

Depois da escolha do nome, lembrei-me logo que o logo teria que ter um olho,

pois achei que seria uma boa ideia.

Cor

Após andar a pesquisar sobre cores, descobri que o azul era uma cor calma e que

o seu uso não era em vão, sendo apelativo para o utilizador. Mas, mesmo assim, não

quis usar o azul, queria experimentar o amarelo, mas como o snapchat era amarelo

achei que não seria uma boa escolha, por isso escolhi o verde.

O verde-escuro corresponde na paleta de cores CMYK ao (C=87 M=20 Y=94

K=6), paleta de cores RGB ao (R=0 G=141 B=75) e ao RGB WebSafe #008d4b. O

verde-claro corresponde na paleta de cores CMYK ao (C=85 M=13 Y=92 K=1), paleta

de cores RGB ao (R=0 G=156 B=83) e ao RGB WebSafe #009c53.

13

Rede Social

Aplicação Móvel

14

A página principal da aplicação móvel serve para as pessoas fazerem o Login e

tem um botão para que direciona a página para a página de registar.

Os campos necessários para “iniciar Sessão” são: o username e a palavra-passe.

O botão de “Login” encontra-se em maior destaque já o botão de “Registar” está

com o tamanho de letra menor e em baixo do botão de “login”.

Na página de “Registar” é preciso escrever o nome, username, email, data de

nascimento, género e palavra-passe. Sendo que a palavra-passe é preciso escrever duas

vezes, pois precisa de ser confirmada.

Ao iniciar sessão somos redireccionados para a página inicial, onde aparece

todas as partilhas feitas pelas pessoas que o utilizador está a seguir.

Em cada partilha temos a opção de votar entre várias fotos, caso seja o caso, e

comentar, se a partilha só tiver uma foto só irá dar a opção para comentar.

O utilizador pode pesquisar por outro utilizador clicando no botão da “Lupa”.

Há duas formas de ir parar ao perfil dos utilizadores. Pode-se clicar no username

de um utilizador numa partilha que tenha feito, ou mesmo, através de uma pesquisa. Já

o perfil do utilizador que está com sessão iniciada, pode ver o seu perfil, clicando no

botão “Pessoa”.

Dentro do perfil de um utilizador encontramos um botão “Seguir” ou “A

Seguir”, de acordo com a relação entre os utilizadores, e no perfil do utilizador com

sessão iniciada encontramos um botão “Conta” na qual o utilizador pode alterar os seus

dados.

15

Conclusão

Este projeto sofreu muitas alterações desde o primeiro esboço até à versão atual. O

primeiro plano era construir uma aplicação para iOS, sistema operativo móvel dos dispositivos

da Apple, mas assim que pesquisei descobri que era preciso ter um computador da Apple, por

isso decidi mudar para Android. Como tinha aprendido C# durante o meu estágio do 11º ano,

não programei em JAVA, linguagem nativa do Android. Depois tinha o plano de ter um

website, que permitisse a consulta dos conteúdos, não daria para registar, apenas iniciar

sessão e ver as partilhas feitas e o perfil.

E assim tinha ficado o meu plano para esta P.A.P. só que por volta de janeiro

aconteceu-me ter ficado sem computador, o que veio alterar todos os planos que tinha.

O website, como era para ser feito em casa, ficou pelo caminho assim como as

features que aplicação era para ter.

Tive que voltar a planear tudo, de forma a conseguir ter a minha aplicação a funcionar

antes do dia da entrega e, claro, da apresentação.

Comecei a desenvolver a aplicação durante o estágio, com a autorização do meu

monitor, onde desenvolvi 80% da aplicação. Se não tivesse começado a desenvolver nessa

altura, não teria o que tenho hoje. E aqui tenho que agradecer ao Mário Constantino, porque

sem ele nada do que sei e tenho implementado na aplicação seria possível.

Quando que acabei o estágio e voltei para a escola, pensava que a parte mais difícil já

estava feita, na realidade estava, mas mais problemas se puseram pelo caminho.

Começaram os problemas quando chego e o computador onde trabalho estava cheio,

ou seja, tinha o disco rígido com 3 ou 4 GigaBytes livres, tive que começar a limpá-lo para que

pudesse começar a trabalhar, instalado os programas que necessitava, como o Visual Studio

Community 2015. Entre desinstalações, limpeza no disco e instalações passou 3 semanas.

Para que conseguisse trabalhar sem interrupções pedi à professora Alice Pereira se me

podia criar uma conta com permissões de administrador, o que foi aceite e deu muito jeito.

A seguir precisava de ter um IP de rede fixo para conseguir aceder ao localhost no meu

smartphone e ir testando a aplicação, não consegui ter, pois a rede da escola não funciona

assim. Então tive que ir desenvolvendo, sem saber se tudo o que estava a implementar estava

100% correto.

Com tudo o que me aconteceu, não tive o tempo que tinha planeado para esta “2ª

versão de P.A.P.”, tive que utilizar tempo fora do período escolar, para conseguir ir acabando o

que faltava, como o Relatório, que tive a ajuda da professora Teresa Fazenda.

Ainda tive esperança de poder testar a aplicação antes da entrega, pois os projetos

iriam ser postos online, como o meu projeto requeria um servidor com SQL Server e que nos

estavam a disponibilizar só tinha MySql, não foi possível fazer os tais testes que queria ter

16

feito.

Pondo todos os problemas de lado, acho que consegui desenvolver uma aplicação com

um grande potencial, sei que não está esteticamente bonito, mas está funcional que era o que

queria que estivesse, no mínimo. Sendo eu mais da parte da programação, apostei mais na

parte da programação deixando o design mais em 2º plano.

Agora falando mais da rede social e do futuro que quero e espero que tenha.

Uma rede social nunca é um projeto acabado, está sempre em constante

desenvolvimento, e a minha não é diferente.

Eu não quero, de todo, que a rede social acabe no final da minha apresentação, muito

pelo contrário, quero continuar a desenvolver e fazer dela o próximo Instagram, não o

substituindo como é óbvio, até porque são conceitos diferentes, mas atingindo o número de

utilizadores a popularidade.

Gostaria um dia de ter a minha empresa e conseguir um parceiro financeiro que

acreditasse tanto no projeto como eu acredito e que quisesse, também, apostar e fazer crescer

esta rede social.

17

Anexos Primeiros Estudos de Layout

WebSite

18

19

20

21

Aplicação Android

22

Segundos Estudos de Layout

23

WebSite

24

Aplicação Android

25

Terceiros Estudos de Layout

Aplicação Android

26

Modelo Gantt

27

28

29

30