Biblioteca Digital do IPG: Relatório de Estágio Curricular – StudioBox (Viseu)

IREI

folitécuico

1 daGuarda

RELATÓRIO DE ESTÁGIO

Licenciatura em Comunicação Multimédia

Rúdi Samuel Fernandes

R E L A T Ó R I O D E E S T Á G I O

RÚDI SAMUEL FERNANDE S

RELATÓRIO PARA A OBTENÇÃO DO GRAU DE LICENCIADO EM COMUNICAÇÃO MULTIMÉDIA

DEZEMBRO 2015

Escola Superior de Educação, Comunicação e Desporto

Instituto Politécnico da Guarda

I

FICHA TÉCNICA

Curso: Comunicação Multimédia Ano: 2015

Instituição de ensino: Escola Superior de educação, comunicação e desporto Morada: Av. Dr. Francisco Sá Carneiro, 50 – 6300-559 Guarda

Telefone: +351 271220 100 Fax: +351 271 222 690 E-mail: ipg@ipg.pt

Orientador de estágio: Carlos Brigas Empresa: StudioBox

Morada: Rua Alexandre Herculano, 291 3510-038 Viseu Telefone: +351232 435 131

Telemóvel: +351 968 405 494 E-mail: geral@studiobox.pt Site: www.studiobox.pt

Supervisor na Organização: Bruno Esteves

II

Agradecimentos

Em primeiro lugar gostaria de agradecer ao Instituto Politécnico da Guarda e à Escola Superior de Educação, Comunicação e Desporto por terem contribuído para a minha formação académica.

Ao Prof. Dr. Carlos Brigas por ter aceitado ser o meu orientador e principalmente pela disponibilidade e apoio fornecidos.

A todos os docentes do curso de Comunicação Multimédia, pelo apoio e pela partilha de conhecimentos ao longo destes três anos.

À empresa StudioBox, por me terem acolhido e me terem feito sentir “um membro da família” e por depositarem em mim confiança nas minhas capacidades, para levar a cabo a realização das diferentes tarefas.

À minha família, pelo apoio que me deram e por todos os sacrifícios feitos para eu puder realizar a licenciatura.

Aos meus amigos/as por todos os momentos e experiências que passamos juntos ao longo destes três anos.

III

Resumo

O relatório de estágio é um elemento fundamental para a finalização da licenciatura em Comunicação Multimédia, este tem como objetivo caracterizar a empresa em que realizei o meu estágio e descrever, pormenorizadamente, todas as atividades realizadas ao longo dos três meses de estágio curricular na empresa StudioBox, situada em Viseu, Portugal

O relatório encontra-se dividido em dois capítulos. O primeiro capítulo tem como objetivo descrever a empresa e os serviços prestados e a sua estrutura organizacional onde o estágio foi realizado. Onde segundo capítulo, são apresentada todas as atividades desenvolvidas na empresa, acompanhadas pelo respetivo enquadramento teórico.

Para finalizar, é realizada uma reflexão final das experiências vividas no estágio como também uma opinião pessoal do estagiário sobre a sua primeira experiência no mundo do trabalho.

IV

Índice Geral

Índice de Tabelas ... VII

Lista de acrónimos e siglas ... VIII

Glossário... IX

Introdução ... 1

Capítulo I – StudioBox ... 3

1.1 – Apresentação da empresa acolhedora – StudioBox ... 4

1.2 – Missão, Valores e Visão ... 4

1.2.1 – Missão da StudioBox ... 4 1.2.2 – Valores da StudioBox ... 5 1.2.3 – A visão da StudioBox ... 6 1.3 – Estrutura Organizacional ... 6 1.4 – Serviços ... 8 1.5 – Comunicação ... 8 1.5.1 – Comunicação Interna ... 9 1.5.2 – Comunicação Externa ... 9 1.5.2.1 – Contacto Pessoal ... 9 1.5.2.2- Correiro Electrónico ... 10 1.5.2.3 – Redes Sociais ... 10 1.5.2.4 – Website ... 11

1.6 – Identidade Visual da StudioBox ... 12

1.6.1 - Nome ... 13

1.6.2 – Símbolo ... 13

1.6.3 – Logótipo ... 14

1.7 – Análise SWOT ... 14

Capítulo II – Trabalhos Desenvolvidos ... 17

V 2.2 – Plano de estágio ... 18 2.3 – Cronograma ... 19 2.4 – Software utilizado ... 21 2.5 – Enquadramento teórico ... 22 2.5.1 – Webdesign ... 22

2.5.2 – Design de Interface para dispositivos móveis ... 23

2.6 – Projetos realizados ... 26

2.7 – Casas do Prior ... 27

2.7.1 – Conceção (Planeamento, Análise e Desenho) ... 27

2.7.2 – Implementação (Desenvolvimento, Testes e Alojamento) ... 31

2.8 – Stramus ... 33

2.8.1 - Conceção (Planeamento, Análise e Desenho) ... 34

2.8.2 – Implementação (Desenvolvimento, testes e alojamento) ... 37

2.9 – Grão Vás Confraria ... 39

2.9.1 - Conceção (Planeamento, Análise e Desenho) ... 39

2.9.2 - Implementação (Desenvolvimento, testes e alojamento) ... 43

2.10 – Clube de Futebol Os Viriatos ... 45

2.11 –Lima Limão Online ... 45

2.12 – My Rally Car ... 46

2.13 – NS Eletricidade ... 46

2.14 – Transportes360 ... 46

2.15 – Fadista Mara Pedro ... 47

2.16 – Design de interfaces para dispositivos móveis ... 48

Reflexão Final ... 51

Bibliografia ... 53

Anexos ... 54

VI

Índice de Figuras

Figura 1 – Estrutura Organizacional da Empresa ... 7

Figura 2 – Página de Facebook da StudioBox ... 11

Figura 3 – Website da StudioBox ... 12

Figura 4 – Marca da StudioBox ... 13

Figura 5 – Símbolo ... 13

Figura 6 – Logótipo ... 14

Figura 7 – Análise SWOT ... 15

Figura 8 - Estrutura Principal de navegação website Casas Do Prior ... 29

Figura 9 - Wireframe da homepage do website Casas Do Prior ... 30

Figura 10 - Template Hotel Master ... 31

Figura 11 - Website Final (Casas Do Prior) ... 33

Figura 12 - Estrutura principal de navegação website Stramus ... 36

Figura 13 - Wireframe da homepage do website Stramus ... 37

Figura 14 - Template Natural Shop ... 38

Figura 15 - Website Final (Stramus) ... 39

Figura 16 - Estrutura principal de navegação website Grão Vás Confraria ... 41

Figura 17 - Wireframe da homepage do website Grão Vás Confraria ... 42

Figura 18 - Template Interface ... 43

Figura 19 – Website Final (Confraria Grão Vás) ... 44

Figura 20 - Edição do vídeo, Fadista Mara Pedro ... 48

Figura 21 - Estrutura principal de navegação das aplicações móveis ... 49

VII

Índice de Tabelas

Tabela 1 - Cronograma de atividades do mês de setembro ... 20 Tabela 2 - Cronograma de atividades do mês de outubro ... 20 Tabela 3 - Cronograma de atividades do mês de novembro ... 21

VIII

Lista de acrónimos e siglas

CMS – Content Management System; DJ – Disc Jokey;

FTP – File Transfer Protocol;

HTML – Hypertext Markup Language; HTTP – HyperText Transfer Protocol; PDF – Portable Document Format; PHP – Hypertext Preprocessor; SQL – Structured Query Language;

SWOT – Strengths, Weaknesses, Opportunities And Threats; URL – Uniform Resource Locator;

IX

Glossário

Browser – É um programa informático que permite os utilizadores navegarem na internet. Check-in/ Check-out – É um estrangeirismo de uma palavra inglesa, que remete o ato

de dar entrada/saída.

Child-Theme – É um processo que permite alterar o estilo e as funções de um template

sem alterar os arquivos originais do mesmo.

Designer – É um profissional que desempenha atividade de carácter técnico-científico,

criativo para elaboração de projetos de design.

E-mail – Também conhecido por correio eletrónico, permite editar, enviar e receber

mensagens através de sistemas eletrónicos de comunicação.

Facebook – É uma rede social gratuita, que permite os seus utilizadores publicarem

fotografias e lista de interesses pessoais.

Layout – Posicionamento de elementos gráficos e texto para dar aparência a uma página. Pixéis – Um pixel, é o menor ponto que forma uma imagem digital, sendo que o conjunto

de milhares de pixéis formam uma imagem inteira.

Plugin – Os plugins são ferramentas utilizadas para expandir as funcionalidades já

existentes no wordpress, existem plugins gratuitos, estes podem ser adquiridos no diretório de plugins do wordpress (www.wordpress.org/plugins/) e plugins pagos.

Slider – Um slider é uma ferramenta audiovisual e fotográfica, é uma exposição

sequencial de fotografias em um dispositivo eletrónico.

Software – É um conjunto de instruções digitais armazenadas em discos ou qualquer

outro suporte físico de dados digitais, são essencialmente programas informáticos utilizados para realizarem determinadas tarefas.

Template – Os templates são ficheiros responsáveis pelo controlo do aspeto e pelo

X

de dados do wordpress e geram o código em HTML que é enviado para os diferentes

browser’s disponíveis.

User-friendly – Software ou elemento informático fácil de perceber e usar pelo utilizador. Website – Agrupamento de páginas web, visualizado num browser, que permite ao

utilizador o contacto com empresas, indivíduos ou locais online.

Widget – Tal como os plugins, os widgets são ferramentas utilizadas para expandir as

funcionalidades, mas ao contrário dos plugins, maior parte dos widgets existentes no mercado podem apenas ser utilizados em secções específicas dos websites, definidas pela equipa responsável pela criação e programação do template.

Wordpress – É uma plataforma CMS de sistema informático que permite o

gerenciamento de conteúdos nos websites.

Youtube – É um website que permite que os seus utilizadores façam upload e partilhem

1

Introdução

O presente relatório de estágio curricular surge no âmbito da licenciatura de Comunicação Multimédia da Escola Superior de Educação, Comunicação e Desporto do Instituto Politécnico da Guarda, este marca a conclusão da licenciatura que se iniciou em setembro de 2012.

O estágio curricular marca o início de uma nova etapa na vida do aluno, pois permite ao aluno um primeiro contacto com o mercado do trabalho, onde tem a oportunidade de pôr em prática todos os conhecimentos, teóricos e práticos adquiridos ao longo do curso assim como adquirir novas competências e conhecimentos.

Este relatório é fruto da permanência de três meses de estágio na empresa

Studiobox, que se encontra localizada na cidade de Viseu.

A StudioBox, localizada em Viseu, foi a entidade acolhedora para a realização do estágio curricular. Trata-se de uma empresa que presta serviços de design e branding em projetos de publicidade, web design e marketing. Posto isto, os conhecimentos que foram obtidos durante os três anos de licenciatura poderiam ser em grande parte aplicados no decorrer deste estágio curricular e, também, a oportunidade de adquirir novas aptidões através dos profissionais que a representam. Esse foi o principal fator de escolha para a realização do estágio nesta empresa. Posteriormente foi elaborado um plano de estágio em conjunto com o supervisor da empresa, de modo a identificar quais os objetivos a atingir com a realização do estágio, por parte do aluno, assim como as tarefas que este iria realizar ao longo dos três meses de estágio (Anexo I).

Este relatório encontra-se dividido em dois capítulos. O primeiro capítulo contém a caracterização pormenorizada da StudioBox, contemplando assim aspetos como a sua história, visão e valores, a sua missão, as subsidiárias que constitui a empresa como um todo, a sua equipa de trabalho, como a empresa funciona no seu quotidiano e uma análise SWOT, que determina o porquê da StudioBox, ser uma empresa de sucesso com cerca de onze anos de atividade a nível mundial.

2

O segundo capítulo está relacionado com o estágio realizado pelo estudante e a todas as atividades desenvolvidas sempre acompanhadas pelos seus procedimentos e estudos realizados para a sua concretização, neste capítulo também é apresentado o enquadramento teórico sobre o design de interfaces e web design. Por fim, é apresentado uma reflexão final do relatório, escrita na primeira pessoa sobre as experiências vividas com o estágio e qual a sua importância a nível académico, pessoal e profissional.

3

Capítulo I – StudioBox

Apresentação da empresa acolhedora

Missão, Valores e Visão

Estrutura Organizacional

Serviços

Comunicação

Identidade Visual

Análise SWOT

4

Neste capítulo é feita uma apresentação e descrição pormenorizada da empresa

StudioBox, das atividades que desenvolve, a sua história, a sua estrutura organizacional,

entidade visual e a sua missão e valores.

1.1 – Apresentação da empresa acolhedora – StudioBox

A StudioBox foi fundada em 2004, é uma empresa especializada na criação de estratégias de comunicação, na planificação de meios e consultoria de imagem, desenvolve entidade corporativas, também é responsável pelo desenvolvimento de web

design, hosting e multimédia. Também participa na realização de eventos sociais,

profissionais e desportivos, para complementar todos esses eventos, despõem de um agenciamento artístico (músicos, DJ’s, modelos, promotores, entertainers, entre outros).

A StudioBox conta com várias parcerias para dar resposta aos diversos trabalhos solicitados pelos seus clientes.

A empresa StudioBox possui várias subsidiárias não só a nível nacional, como também a nível mundial, marcando a sua presença em Portugal, na cidade de Lisboa e na cidade de Viseu, no Brasil, no estado de Santa Catarina e brevemente na capital de Angola em Luanda.

1.2 – Missão, Valores e Visão

A missão, visão e valores são os principais fatores responsáveis pela determinação da imagem favorável ou desfavorável de uma empresa. Esta é avaliada segundo a opinião dos diferentes públicos (Magdalena, 2012).

1.2.1 – Missão da StudioBox

Segundo Valadares (2002), a missão de uma empresa é a explicação da existência da empresa e quais os seus objetivos e estratégias. Esta deve ser clara, objetiva e da compreensão de todos os elementos da organização. O autor defende ainda que a missão deve refletir a filosofia do trabalho, sem qualquer preocupação com afirmações quantitativas.

5

em que está envolvida. Ela é responsável por determinar qual o seu negócio, e de que forma ela atua neste.

A missão da StudioBox consiste em auxiliar os seus clientes a desenvolverem um processo de comunicação válido para com os seus públicos-alvo. Cada cliente é analisado de forma única, com o objetivo de definir a melhor estratégia de comunicação, a fim de propor um plano de ações a desenvolver de forma aos melhores resultados serem atingidos.

1.2.2 – Valores da StudioBox

Segundo Ribeiro (2008), os valores básicos constituem a ideologia central da empresa e são relativamente constantes. Os valores básicos são alguns conceitos centrais de uma empesa. Estes representam os valores fundamentais para a existência da organização e são independentes do tipo de atividade em que a organização se encontra.

A StudioBox rege-se através de um conjunto de valores simples, no entanto essenciais que definiu o sucesso da empresa ao longo destes quase onze anos de existência. Esses valores assentam em:

 Respeito – Tratamento gentil para com os seus clientes, promovendo assim a harmonia e também a motivação no ambiente de trabalho da empresa;

 Criatividade – A empresa está preparada para ouvir e também aconselhar os seus clientes de forma a atingir o sucesso nos seus projetos, isto graças ao facto de possuir uma equipa de profissionais altamente qualificados;

 Rigor – Realizar todos os projetos com o maior profissionalismo e dentro dos prazos estipulados para com o seus clientes;

 Ética – Em todas as propostas que são apresentadas ao cliente, a empresa torna-as flexíveis, para que toda a valorização do sucesso do projeto seja focado na opinião do cliente, pois o projeto será sempre produzido ao gosto do cliente.

 Excelência – Não só satisfazer os clientes, mas como também, exceder as suas expectativas.

6 1.2.3 – A visão da StudioBox

A visão entende-se como uma orientação da empresa para o seu futuro, não fugindo á realidade em que a empresa se encontra no presente, no entanto esta deve ter um carácter desafiante com o objetivo de criar motivação para com os seus colaboradores a alcançarem esses objetivos. “A visão é um quadro de um estudo futuro desejado, uma descrição de como seria daqui a alguns anos, a partir de agora. É um quadro dinâmico do futuro. É mais do que um sonho ou um conjunto de esperanças: é um compromisso” (Scott et al., 1998).

A StudioBox mantém a visão com qual começou, esta acredita que um bom resultado é obtido através de uma colaboração com os seus clientes.

1.3 – Estrutura Organizacional

Segundo Wagner (2011) a estrutura organizacional é simplesmente uma ferramenta para atingir as situações almejadas pela empresa e deve ser elaborada de acordo com os objetivos e as estratégias estabelecidas pela mesma. Para obter uma organização da empresa adequada, deve ter-se em consideração a estrutura organizacional, as rotinas e os procedimentos administrativos da mesma.

7 Figura 1 – Estrutura Organizacional da Empresa

Fonte: Estagiário

A estrutura organizacional da StudioBox encontra-se dividida em dois grupos (Figura 1), no primeiro grupo encontra-mos o topo hierárquico, onde se destaca o diretor da entidade empresarial, Bruno Esteves, que para além da direção, atua como comercial no contacto com os clientes da empresa e como também na aquisição de novos clientes. O segundo grupo encontra-se subdividido em dois departamentos diferentes que se encontram no mesmo nível hierárquico:

 Departamento Criativo – Este departamento é formado pelos designers, Susana Esteves (web designer), responsável pela criação e manutenção dos websites, Patrícia Belo (designer gráfico) é responsável pela criação de wireframes, logomarcas, cartões-de-visita e cartazes e por fim Beto Barreto (Editor) é responsável pela edição pela revista StudioBox (edição Portuguesa) e pela revista Valeu! (edição Brasileira).

 Departamento Comercial – Este departamento é constituído por João de Almeida Moreira e também pelo Bruno Esteves (diretor da empresa), estes são

Director

Bruno Esteves

Departamento

Criativo

Susana Esteves

(webdesigner)

Patrícia Belo

(Designer)

Beto Barreto

(editor)

Departamento

Comercial

João de Almeida

Moreira

8

responsáveis por executar contactos telefónicos diariamente com o objetivo de obter novos clientes e também de apresentar os serviços da entidade empresarial.

1.4 – Serviços

A StudioBox é uma empresa multisserviços e oferece aos seus clientes uma lista muito diversificada de serviços tendo como especialidade o design comunicacional.

 Desenvolvimento de produtos para a web – Webdesign, lojas e-comerce,

newsletters e aplicações interativas.

 Desenvolvimento de Identidades corporativas – Marca/identidade, linha gráfica, packaging, naming e campanhas publicitárias.

 Gestão de conteúdos – A StudioBox realiza introdução e gestão de conteúdos para os diversos websites dos seus clientes.

 Correspondência – Receção e envio de correspondência, registando-as em papel ou digitalmente. Distribuição da documentação às respetivas subsidiárias da empresa.

 Correio eletrónico – Envio periodicamente de e-mails com campanhas publicitárias.

 Certificação de qualidade – Análise de produtos já existentes no mercado, informando assim uma análise SWOT dos seus produtos, aconselhando assim o que deverá ser feito para obter melhores resultados.

 WebHosting – A StudioBox disponibiliza serviços de hospedagem para os websites realizados pela mesma, garantido assim uma melhor segurança dos dados dos clientes e também realizando Backups desses dados regularmente em caso de falha informática.

1.5 – Comunicação

A comunicação entende-se por todas as formas que foram desenvolvidas por uma determinada organização com a intenção de fazer com que os seus colaboradores se relacionem e interagem com os seus públicos.

9

Bahia (1995) defende que a comunicação empresarial é um conjunto de métodos, recursos, técnicas, meios, etc. Pelo qual a empresa se dirige ao público interno (funcionários da entidade empresarial) e ao público externo (os clientes da mesma). Após a análise e compreensão da definição de públicos feita por Bahia, podemos então considerar que existem aqui dois tipos de comunicação, a comunicação interna e a comunicação externa.

1.5.1 – Comunicação Interna

A comunicação interna é direcionada para os funcionários e colaboradores da empresa, esta define-se como um conjunto de atos de comunicação que se produzem no interior da empresa (Lindon et al., 2011).

Na StudioBox, a comunicação interna é informal, pois maior parte da comunicação é feita pessoalmente sempre que possível, quando necessário efetua-se a comunicação através de telefonemas, mensagens ou até mesmo através de plataformas voip, tais como o Skype.

1.5.2 – Comunicação Externa

A comunicação externa inclui toda a veiculação de informação e todos os comunicados emitidos pela organização empresarial para um público ou uma opinião pública fora dos limites internos. Em geral, o uso que a empresa faz dos meios de comunicação para o fim de tornar conhecidas as suas mensagens (Bahia, 1995).

A StudioBox tem os seguintes meios para distribuir a sua mensagem:

1.5.2.1 – Contacto Pessoal

Visto que a opinião do cliente é valorizada, a StudioBox tenta manter o contacto pessoal com os seus clientes o mais frequentemente possível, toma em consideração todos os pontos e opiniões que os clientes fazem em relação ao trabalho que a empresa está a desenvolver, tomando assim em consideração a ideia do cliente e analisar se essa é uma mais-valia para o projeto ou não. Desta forma o cliente tem uma participação regular no

10

desenvolvimento do projeto e também deposita um voto de confiança na empresa para a realização do mesmo.

1.5.2.2- Correiro Electrónico

O contacto efetuado através do serviço de correio eletrónico é o principal meio de comunicação entre a entidade empresarial e os seus clientes, este é utilizado com o principal objetivo de transferir documentos de pequena dimensão, normalmente documentos em word e imagens dos trabalhos que estão a ser realizados, quando é necessário enviar o trabalho final ao cliente a empresa recorre ao serviço WeTransfer para enviar ficheiros de grande dimensão.

1.5.2.3 – Redes Sociais

Com a evolução das novas tecnologias, as comunicações a nível global tornaram-se não só possíveis como também de fácil acesso a qualquer pessoa, este tipo de comunicações quebra barreiras do espaço e do tempo da comunicação, desta forma não existem fronteiras e a comunicação pode chegar a qualquer lugar do mundo.

Para ter uma boa comunicação com clientes a longa distâncias (normalmente fora de Portugal) a StudioBox fornece aos seus clientes as versões dos trabalhos que realizou até esse ponto, utilizando principalmente o facebook (Figura 2), mas também recorrendo a outras redes socias, por exemplo, utilizando o youtube, quando o trabalho pedido pelo cliente envolva edição de vídeo, obtendo facilmente o feedback do cliente.

11 Figura 2 – Página de Facebook da StudioBox

Fonte: www.facebook.com/design.by.studiobox - acedido a 15/10/2015

1.5.2.4 – Website

O website da StudioBox (Figura 3) existe para dar a conhecer aos seus clientes quais os serviços que a entidade empresarial presta, também serve como uma forma de repositório de todos os trabalhos efetuados pela mesma, ou seja, um portfólio organizado de forma a dar a conhecer aos clientes os trabalhos que já foram efetuados ao longo dos

12

anos, também possui um formulário para contactar a empresa, como também um formulário para pedir um orçamento à empresa, este website pode ser acedido em

www.studiobox.pt, este possui um layout simples e de fácil utilização, para que seja possível a todos os seus públicos o consultarem sem qualquer tipo de dificuldade.

Figura 3 – Website da StudioBox Fonte: www.studiobox.pt – acedido a 15/10/2015

1.6 – Identidade Visual da StudioBox

Segundo Lindon et al. (2011), a marca designa-se sob um conjunto de signos, formas, cores e em alguns casos em sons. De forma a captar a atenção dos consumidores na marca, para facilitar o processo da sua identificação e atribuição. A marca de uma entidade corporativa é composta por um conjunto de elementos que têm o objetivo de representar um nome, um produto, um serviço, uma empresa, uma instituição ou até mesmo uma ideia. A marca gráfica normalmente é constituída pelo logótipo e um símbolo e em alguns casos pode ser complementada com um slogan ou uma assinatura. A marca gráfica da StudioBox (Figura 4), é apenas constituída pelo logótipo e pelo símbolo.

13 Figura 4 – Marca da StudioBox

Fonte: Arquivo da StudioBox

1.6.1 - Nome

O nome StudioBox, designado da língua inglesa, representa uma entidade empresarial de origem Portuguesa onde todos os seus colaboradores comunicam entre si em língua Portuguesa, o nome designa-se da língua inglesa pelo facto de esta língua ser uma das principais línguas universais, o que fará com que o nome desta entidade empresarial seja interpretado por maior parte do público externo.

1.6.2 – Símbolo

O símbolo da StudioBox (figura 5), representa os dois valores principais da empresa: excelência e criatividade, complementando assim a logomarca graficamente.

Figura 5 – Símbolo Fonte: StudioBox

14 1.6.3 – Logótipo

Dentro dos componentes existentes na marca de uma entidade empresarial, o logótipo (Figura 6) representa graficamente o nome da entidade empresarial, em certos casos é a única identificação da empresa, como por exemplo a marca do Google, Sony,

Panasonic, que não possuem outros componentes para além do logótipo. O logótipo é

responsável por dar o reconhecimento à organização, identificando assim as suas respetivas características de atividade, produto ou serviço dentro do mercado ou para o público externo.

Figura 6 – Logótipo Fonte: StudioBox

1.7 – Análise SWOT

SWOT é um acrónimo de quatros focos de análise de uma entidade empresarial,

strenghts (forças), weaknesses (fraquezas), opportunities (oportunidades) e por fim threats (ameaças). Uma força é um fator positivo, é uma característica que permite a uma

entidade empresarial aumentar a sua competitividade no mercado, uma fraqueza é algo que se encontra em falta nessa entidade empresarial, é algo negativo, o que cria uma desvantagem na empresa em relação à sua concorrência. Quando os pontos fortes de uma entidade empresarial superam os fracos a empresa torna-se competitiva no mercado.

Este é um modelo de análise que possibilita a perceção das características internas das organizações como também o ambiente externo. Depois da análise destes quatro focos mencionados acima, as determinadas empresas podem tomar decisões de forma a diminuir danos devidos a estratégias mal feitas.

15

Para Daychouw (2007) a análise SWOT é um instrumento fundamental para qualquer tipo de entidade, seja esta com ou sem fins lucrativos. Este modelo permite fazer uma análise precisa da situação em que a entidade se encontra, isto permite definir decisões estratégicas que possam ser tomadas no presente e futuro da entidade. Este modelo tem a sua importância no apoio à formulação de estratégias e tem a capacidade de promover um conforto entre as variáveis internas e externas existentes, facilitando assim escolhas e estratégias alternativas.

A análise SWOT da StudioBox (Figura 7), foi baseada em informações que foram obtidas através de conversas informais entre o responsável da empresa e o estagiário, mas também pelas experiências obtidas dentro da empresa.

Figura 7 – Análise SWOT Fonte: Estagiário

16

No ambiente interno, os pontos fortes da empresa reconhecem-se pelo vasto conhecimento profissional dos trabalhadores que constituem a entidade empresarial, desta forma pode garantir uma maior gama de serviços que a empresa pode prestar, não esquecendo que todos os projetos são realizados com o mesmo grau de exigência e de profissionalismo. Outro ponto forte da empresa é a fidelização dos clientes, muitos dos clientes que a empresa possui estão com ela desde que esta abriu os seus serviços ao público, o facto de a empresa estar situada no centro de Viseu é bastante vantajoso, isto faz com que a empresa seja facilmente visível como também reduz a deslocação do colaborador com o cliente.

Em relação aos pontos fracos destaca-se o facto de a empresa não possuir máquinas de impressão nem servidores para alojar os websites feitos pela mesma. Estes são os maiores problemas da empresa, pois maior parte dos seus serviços contratados à

StudioBox são para impressão, cartões-de-visita, cartazes, flyers, etc.

Surgem as oportunidades para a empresa e tentar ganhar mais terreno no mercado. A StudioBox está a desenvolver uma loja e-commerce para vender diversos produtos relacionados com a figura histórica Viriato (Viriatvs), t-shirts, camisolas, canecas, etc.

Em contra partida existem diferentes ameaças à sustentabilidade da empresa devido à presente crise económica. Para além desta crise económica existem várias empresas que prestam os mesmos serviços que a StudioBox, com preços mais acessíveis para os clientes.

17

Capítulo II – Trabalhos Desenvolvidos

Objetivos do estágio

Plano de Estágio

Cronograma

Software Utilizado

Enquadramento Teórico

Projetos Realizados

18

Neste segundo capítulo do relatório de estágio são apresentados os objetivos de estágio, o plano de estágio, os cronogramas das tarefas realizadas no decorrer dos três meses de estágio curricular, e por fim, é apresentada a descrição da metodologia e tarefas realizados pelo estagiário na StudioBox.

2.1 – Objetivos do estágio

No início do estágio curricular tive como principal objetivo aperfeiçoar e aprofundar todos os conhecimentos adquiridos ao longo dos três anos da licenciatura de Comunicação Multimédia. Outro dos objetivos que tive foi o de realizar, com sucesso, todas as tarefas propostas, principalmente aquelas que estavam referidas no plano de estágio, como também contribuir para os projetos da empresa e ver o meu trabalho ser valorizado, queria principalmente conseguir trabalhar numa das áreas que mais gosto que é web design, com esperança de adquirir mais conhecimentos para ter uma maior experiência profissional.

2.2 – Plano de estágio

Após ter sido aceite na empresa StudioBox e antes do estágio curricular começar, foi efetuado um plano de estágio curricular com o principal objetivo de definir e planear todas as possíveis tarefas que deveriam ser realizadas durante o decorrer do mesmo (Anexo I). Foram planeadas as seguintes tarefas:

 Design e criação gráfica de logotipos e estacionários;

 Webdesign;

 Layouts (Mockups) para aplicativos móveis;

 Pesquisa de dados na internet;

 Promoção de redes sociais;

 Registo Fotográfico;

 Tratamento de imagens;

19

O plano de estágio estipulado pelo supervisor de estágio na organização foi cumprido com sucesso, incluindo todos os trabalhos realizados nos prazos estipulados, fazendo com que a equipa da empresa considerasse que o estagiário dominava todas as ferramentas utilizadas.

2.3 – Cronograma

Para Heldman (2005) o cronograma detalha todas as atividades de um projeto num formato que lista o trabalho pretendido do início ao fim. Nas tabelas seguintes descrevem de uma forma resumida as atividades realizadas pelo estagiário na empresa, durante os meses de 1 Setembro e 1 Dezembro (Tabela 1, Tabela 2, Tabela 3).

O cronograma está subdividido em várias atividades que são as seguintes:

 Pesquisa e edição de vídeo – Todas as tarefas em que o estagiário necessitou de utilizar ferramentas para edição de vídeo, como também efetuou pesquisas de elementos audiovisuais para inserir nesses projetos.

 Web design – Atividades que estavam relacionadas com a criação e modificação da estrutura e do design de páginas web, estas tarefas normalmente envolvem pesquisa de informação, registo fotográfico e pesquisa e tratamento de imagens.

 Design Gráfico – São atividades em que o estagiário recorre normalmente a programas como o Adobe Illustrator ou CorelDraw para a criação de desenhos vetoriais, como por exemplo: Logotipos, cartões-de-visita, criação de wireframes e papel timbrado.

 Registo Fotográfico – Todas as atividades em que o estagiário necessitou catalogar todos os produtos que seriam inseridos nos websites de e-commerce, para desempenhar esta tarefa com sucesso, foi necessário que o estagiário fotografa-se todos os produtos, preocupando-se com a iluminação e ângulo em que essas fotografias eram tiradas e também que regista-se o nome do modelo do produto com também as suas correspondentes referências.

 Pesquisa e tratamento de imagens – Tarefas em que foi solicitado ao estagiário a pesquisa e também o tratamento de imagens para serem aplicadas em websites e em redes sociais.

20

 Outros – Todas as tarefas elaboradas pelo estagiário com o fim de auxiliar os colaboradores da empresa, como por exemplo: Entrega dos produtos utilizados para os registos fotográficos aos respetivos clientes, entrega de projetos finais aos clientes, introdução de conteúdos em websites, gestão de redes sociais dos respetivos clientes da empresa.

Atividades Semanais de Setembro 1 a 4 7 a 11 14 a 18 21 a 25 28 a 30 Pesquisa e edição de vídeo

Web design Design Gráfico

Registo Fotográfico

Pesquisa e tratamento de imagens Outros

Tabela 1 - Cronograma de atividades do mês de Setembro

Atividades Semanais de Outubro 1 a 2 5 a 9 12 a 16 19 a 23 26 a 30 Pesquisa e edição de vídeo

Web design Design Gráfico

Registo Fotográfico

Pesquisa e tratamento de imagens Outros

Tabela 2 - Cronograma de atividades do mês de Outubro

Atividades Semanais de Novembro 2 a 6 9 a 13 16 a 20 23 a 27 30 Pesquisa e edição de vídeo

21

Design Gráfico

Registo Fotográfico

Pesquisa e tratamento de imagens Outros

Tabela 3 - Cronograma de atividades do mês de Novembro

2.4 – Software utilizado

Para elaborar as tarefas propostas durante o estágio curricular, pela entidade empresarial, o estagiário teve de utilizar diversos programas informáticos para a realização desses projetos. A maior parte desses programas foram lecionados durante os três anos de licenciatura de Comunicação Multimédia. Os programas em que o estagiário não tinha qualquer tipo de formação para a sua utilização teve uma leve explicação de como funcionam por parte dos colaboradores da entidade empresarial e também realizando diversas pesquisas sobre o seu funcionamento, adquirindo assim novos conhecimentos. O estagiário utilizou os seguintes programas informáticos:

 Adobe Photoshop – Este é um programa informático utilizado para a edição de imagens bitmap, ou seja, editar e manusear todo o tipo de fotografias. Desde o seu tamanho, texturas, cor, filtros, etc.

 Adobe Illustrator – Este é um software utilizado para desenho vetorial, este programa informático permite que o utilizador crie e edite vários produtos, como por exemplo: papel timbrado, cartões-de-visita, logomarcas, cartões-de-visita, cartazes, etc.

 Adobe Acrobar XI Pro – Este programa informático permite a criação e edição de documentos com o formato PDF, este programa permite que o utilizador crie documentos interativos, como por exemplo: Criação de formulários, caixas de textos e imagens com as formatações que o designer deseja, não danificando assim a estrutura do documento.

 Adobe Première – Este software é utilizado para a criação e edição de vídeo, este oferece muitas opções como efeitos de transição e filtros de imagem.

22

 Filezilla – Software FTP open-source, este programa informático é utilizado para fazer upload de diferentes tipos de ficheiros para servidores remotos.

 WampServer – Este programa informático é usado para instalar rapidamente no computador os softwares PHP, MySQL e Apache, ou seja, simula um servidor local no computador do utilizador.

 Sublime Text 2 – Este programa informático é um editor de texto, direcionado para linguagens de programação, tais como: HTML, PHP, JavaScript, CSS, etc.

 Poedit – É um programa informático que permite a edição de ficheiros em formato po e pot, essencialmente permite a tradução de website sem modificar o código original.

 Camtasia Studio 8 – É um programa informático que permite a gravação do ambiente de trabalho do utilizador, este tem também funcionalidades muito limitadas de edição de vídeo.

2.5 – Enquadramento teórico

2.5.1 – Webdesign

Para a criação deste website realizado durante o estágio curricular, teve-se por base a estratégia e fundamentos de Santos (2009):

 A primeira etapa trata da conceção, esta tem como objetivo identificar as informações e o conteúdo que o website deverá conter; as funcionalidades a implementar; a informação que este irá processar com também as restrições exigentes.

 A segunda etapa trata da implementação, em que o objetivo é identificar o processo de criação do website, aqui irão se definidas e produzidas as estruturas de dados, testes e alojamento e compra do domínio, nesta etapa o website está finalizado e funcional.

 A terceira e última etapa trata da manutenção, esta envolve todas as modificações que tenham sido realizadas após a aceitação do website por parte do cliente, estas

23

modificações podem tratar de adicionar novas funcionalidades, correção de erros, ou introdução de novos conteúdos.

No entanto as etapas mencionadas anteriormente, podem dividir-se em sete tarefas:

 Planeamento – Nesta tarefa o web designer aglomera ideias e tem que reconhecer as necessidades gerais do website, geralmente, isso inclui as respostas às perguntas: “Qual o propósito da empresa?”, “Qual a intenção com a existência do

website?”, “Quais os objetivos principais”, “Qual é o público-alvo?”, “Quais as

principais características do público-alvo?” e “Que informações disponibilizar?”;

 Análise – Esta tarefa trata-se do reconhecimento detalhado de todas as funções existentes no website, englobando assim a pesquisa, bem como a classificação de matérias, para determinar que informação será colocada e onde;

 Desenho – esta tarefa destina-se ao desenho da navegação do website, através de

wireframes, um esquema do protótipo para dar uma ideia do website final ao

cliente;

 Desenvolvimento – Nesta tarefa o web designer trata da programação, execução e produção dos diferentes tipos de conteúdos para o website;

 Teste – Esta tarefa destina-se á verificação de todas as funcionalidades do website com o objetivo de alcançar aceitação do utilizador;

 Domínio/Alojamento – Trata-se de disponibilizar o website na world wide web, de forma a ser publicado para o utilizador final;

 Manutenção – Todas as alterações que tenham que ser efetuadas após a publicação do website.

2.5.2 – Design de Interface para dispositivos móveis

À medida que o tempo passa, existem cada vez mais utilizadores nos meios de comunicação tecnológicos, estes meios necessitam de uma simplicidade de procedimentos e facilidade de acesso para com o utilizador, existindo assim necessidade de existir design interface, esta área é extremamente importante na comunicação entre o utilizador e a máquina.

24

Apesar de o design de interface ser um processo que envolve a integração de métodos que permitam a satisfação do utilizador final, a realidade é que nem sempre se criam interfaces amigáveis aos utilizadores, o objetivo de um interface é ser centrado no utilizador, ou seja, simples, user-friendly e operacional.

Existem várias metodologias que asseguram um bom design de interface:

 Análise de tarefas – Esta etapa é um processo de aprendizagem sobre os utilizadores, é aconselhável realizar uma análise de tarefas o mais cedo possível num projeto, especialmente antes do design de interface, tem como objetivos observar esses utilizadores em tempo real (na utilização da aplicação), perceber em detalhe como eles realizam as suas tarefas e cumprem os seus objetivos, determinar a diversidade dos utilizadores (pessoal, social e cultural), para ajudar a finalização da tarefa, de que forma os utilizadores são influenciados pelo ambiente físico e que tipo de conhecimento e experiência estes já tinham adquirido no passado.

 Teste de usabilidade – Esta etapa refere-se a efetuar uma avaliação da aplicação e testá-la através de utilizadores, durante o teste os participantes completam determinadas tarefas comuns enquanto os responsáveis pelo teste observam o seu desempenho, o objetivo trata-se de identificar qualquer problema com a usabilidade da aplicação, adquirindo assim dados qualitativos e quantitativos de forma a determinar a satisfação do participante com a aplicação. Um teste de usabilidade oferece muitos benefícios para os responsáveis pelo desenvolvimento da aplicação, tais como: aprender se os participantes são capazes de completar tarefas específicas, identificar o tempo que estes demoram a efetuar as tarefas, identificar o nível de satisfação dos participantes para com a aplicação e por fim, identificar mudanças necessárias para melhorar o desempenho de acordo com os objetivos de usabilidade.

 Avaliação heurística – Nesta etapa os responsáveis pelo desenho e desenvolvimento da aplicação comparam os resultados de acordo com os princípios de usabilidade aceites na generalidade, esta etapa normalmente resulta em uma lista de potenciais problemas na usabilidade de uma aplicação, a avaliação heurística apresenta diversas vantagens, tais como: os responsáveis

25

pelo desenvolvimento da aplicação recebem um feedback cedo, durante o processo de design, pode ajudar a sugerir abordagens mais corretas para corrigir o design da aplicação e ajuda a prever possíveis problemas que possam ser encontrados no futuro. No entanto realizar esta avaliação também pode apresentar algumas desvantagens, tais como: especialista na área de usabilidade podem ser difíceis de encontrar, é aconselhável usar vários especialistas e analisar os diferentes resultados e por fim a avaliação heurística é realizada para encontrar pequenos erros na aplicação.

De acordo com o Nielsen Norman Group1 _{existem dez princípios gerais para design}

de interfaces:

 Visibilidade do estatuto do sistema – O sistema deve manter os utilizadores sempre informados sobre tudo o que está a acontecer.

 Manter o sistema próximo do mundo real – O sistema deve falar a mesma língua do utilizador, com palavras e conceitos familiares ao utilizador, para que a informação seja disponibilizada numa ordem natural e lógica.

 Liberdade e controlo do utilizador – Regularmente os utilizadores escolhem funções do sistema por engano, quando isto acontece os utilizadores têm que ter a opção de sair rápido sem qualquer tipo de diálogo.

 Consistência e padrões – Os utilizadores não devem ponderar se palavras diferentes, situações ou ações significam a mesma coisa.

 Prevenção de erros – Ter um design cuidadoso que evite futuros problemas ou até mesmo mensagens de erros.

 Reconhecimento em vez de lembrança – Minimizar a necessidade de memória do utilizador, deixando os objetos, ações e opções visíveis para fácil navegação.

 Estética minimalista do design – Diálogos não devem conter informação que é irrelevante ou raramente necessitada.

1 _{Adaptado e traduzido pelo estagiário. Fonte:}

26

 Ajudar os utilizadores a reconhecerem, diagnosticar e recuperar erros – Mensagens de erros devem ser exprimidos em línguas reconhecíveis pelos utilizadores (sem qualquer tipo de código).

 Ajuda e documentação – Mesmo sabendo que os melhores sistemas podem ser usados sem qualquer tipo de documentação, poderá ser necessário algum tipo de ajuda, portanto será sempre útil deixar alguma documentação caso os utilizadores precisem de ajuda.

 Flexibilidade e eficiência de utilização – Elementos que não são reparados pelos utilizadores inexperientes, mas normalmente aceleram a interação do utilizador experiente.

2.6 – Projetos realizados

Durante os três meses de estágio, o aluno realizou tarefas propostas pela

StudioBox, cumprido maioritariamente a função de web designer mas, tendo também

colaborado em projetos de edição de vídeo e também de design gráfico. A entidade empresarial deu a oportunidade ao estagiário de participar num grande número de projetos nas diversas áreas de multimédia:

 Casas do Prior;

 Stramus;

 Grão Vás Confraria;

 Clube de Futebol Os Viriatos;

 Lima Limão Online;

 My Rally Car;

 NS Eletricidade;

 Transportes360;

Nos próximos pontos são descritas as tarefas e o processo criativo de alguns projetos em que o aluno participou.

27

2.7 – Casas do Prior

Casas do prior é uma instituição de alojamento situada em Trevões, Viseu, foi pedido à empresa que se realiza-se um website para a instituição em causa.

O cliente solicitou que este website contivesse as mesmas características que um

website de um hotel, ou seja, que existisse uma forma de os clientes puderem efetuar o check-in/check-out e que o responsável pela instituição recebesse a correspondente

notificação, o website também deveria conter informação sobre a instituição, como também uma biblioteca multimédia sobre a mesma.

2.7.1 – Conceção (Planeamento, Análise e Desenho)

A criação de todos os websites desenvolvidos durante o estágio curricular decorreram do seguinte modo:

Planeamento – Antes de passar à construção do website, é necessário efetuar um

planeamento, ou seja, reunir o máximo de conteúdos ou informações que vão influenciar determinados aspetos e comportamentos do website final, foram respondidas várias questões, mencionadas no ponto (2.51):

1. Qual o propósito da empresa?

A empresa Casas do Prior tem como objetivo fornecer alojamento rural aos seus clientes, oferecendo assim a tranquilidade e isolamento e conforto aos seus clientes.

2. Qual a intenção da existência do website?

O website Casas do Prior tem a intenção de transmitir aos seus utilizadores a localização e os contactos da instituição como também disponibilizar uma biblioteca multimédia da mesma e ao mesmo tempo facilitar o método de reserva para os seus clientes.

28

3. Quais os objetivos principais?

O principal objetivo das Casas do Prior é de despertar o interesse dos seus utilizadores em efetuarem uma reserva na instituição, recorrendo a vários elementos visuais para despertar esse interesse.

4. Qual o público-alvo?

O público-alvo da instituição Casas do Prior engloba indivíduos na faixa etária entre os vinte cinco e sessenta anos de idade.

5. Quais as principais características do público-alvo?

As características do público-alvo podem variar de pessoa para pessoa, mas a instituição aponta para pessoas que têm necessidade de procurar tranquilidade e conforto para a sua estadia, a instituição também oferece disponibilidade a alojar crianças, expandindo assim o seu público-alvo não só para casais mas também para famílias.

6. Que informação disponibilizar?

As informações a disponibilizar no website serão apenas as necessárias, tais como: uma biblioteca de imagens, todos os contactos da instituição, o número de quartos disponíveis para alugar, como também as características de cada um deles e ser possível de verificar no website se esse quartos estão disponíveis na data que os utilizadores desejam efetuar a sua reserva.

Análise – Durante esta fase foi sugerido pelo supervisor na organização, Bruno

Esteves, que realiza-se uma breve pesquisa de websites já existentes nesta área de forma a ter uma base inicial como exemplo, após essa pesquisa ter sido realizada, as informações que foram obtidas, foram refletidas e de seguida propostas ao cliente (Casas do Prior) foram as seguintes:

 Foi decidido juntamente com o cliente e com a colaboradora Susana Esteves que o menu seria constituído com apenas um nível, pelo facto de não haver necessidade para mais, visto que a homepage disponibiliza muita informação importante, seguindo esta decisão foi construído então o modelo do menu

29

principal (Figura 8 e Anexo II), disposto do seguinte modo: “home”, “quartos”, “galeria”, “booking.com”, “sobre nós”, “pontos de interesse” e “contactos”.

Figura 8 - Estrutura Principal de navegação website Casas Do Prior Fonte: Estagiário

Desenho – O cliente desejava um website com um design “limpo”, de boa

apresentação, objetivo, simples com boa usabilidade e com fácil interação. Posto isto, a plataforma CMS que foi utilizada foi o wordpress, pois é nesta plataforma que a

StudioBox constrói todos os seus websites, dos clientes.

No cabeçalho da homepage é apresentada a morada por extenso e um plugin pedido por parte do cliente para traduzir o website para todas as línguas utilizadas na web, como também uma ligação para o facebook da entidade. A secção número um é constituída por um slider interativo de imagens, todas estas imagens têm uma dimensão de mil novecentos e vinte pixéis por setecentos e quarenta pixéis (1920px x 740px), a secção número dois é constituída por mais um slider, mas este com um propósito diferente do que o slider que se encontra na secção número um, este tem como objetivo mostrar ao utilizador os quartos disponíveis que as casas do prior têm para oferecer aos seus clientes, a secção número três possibilita ao utilizador que este faça uma reserva, indicando assim em que dia ele deseja fazer o seu check-in/check-out e descrever quantos pessoas irão com esse utilizador (adultos e crianças), a secção número quatro está constituída por uma pequena galeria das casas do prior e também testemunhos de clientes que já visitaram esta instituição, por fim, a secção número cinco é o footer do website, com determinadas informações consideradas importantes tanto para o cliente como para o estagiário, após estas informações foi desenhado pelo estagiário um wireframe do website final (Figura 9 e Anexo III).

30 Figura 9 - Wireframe da homepage do website Casas Do Prior

Fonte: Estagiário

Juntamente com o cliente foi decidido que informação foi disponibilizada em cada página do website, desta forma o estagiário realizou wireframes correspondentes a cada página de forma a estas apropriarem-se às necessidades do cliente, na página “Quartos” estão expostos todos os quartos que a entidade tem para oferecer com as correspondentes informações a cada um deles, na página “Galeria” estão disponíveis dois slideshows, o primeiro slideshow contém apenas imagens do exterior da entidade, o segundo slideshow é constituído por imagens do interior da entidade, a página “Booking.com” disponibiliza um plugin do website Booking (www.booking.com) para que os clientes consigam fazer a sua reserva através do site Booking, na página “Sobre Nós” foi introduzida informação em relação à entidade, a página “Pontos de Interesse” é constituída por pontos turísticos da zona rural de Trevões de forma a complementar a experiência dos clientes da entidade, por último na página de “Contactos” é apresentado ao utilizador um formulário de envio de mensagem que irá diretamente para o e-mail da entidade e informações como o contacto telefónico, o e-mail por extenso (caso o utilizador não queira utilizar o formulário) e também a morada da entidade.

31 2.7.2 – Implementação (Desenvolvimento, Testes e Alojamento)

Desenvolvimento – Na realização desta etapa de desenvolvimento do website da

entidade Casas do Prior, recorreu-se à utilização de tecnologias, como HTML, e a folhas de estilo CSS. Ao utilizar estas tecnologias torna-se possível alterar a estrutura e o aspeto de todo o website. Para efetuar estas alterações, recorreu-se ao software mencionado no ponto (2.4), sublime text 2.

Nesta fase de criação do website, foi criado então o menu principal do website, referido no subponto (2.7.1), foram selecionadas as cores do website, como também a instalação do template e os plugins/widgets que serão necessários em algumas áreas do

website, tendo como objetivo satisfazer todas as necessidades e assim obter um resultado

com sucesso.

No website em questão foi utilizado o template denominado por: Hotel Master (Figura 10), desenvolvido pela empresa GoodLayers (www.goodlayers.com/).

Figura 10 - Template Hotel Master

Fonte: http://demo.goodlayers.com/?theme=hotelmaster – acedido a 06/01/2016

Para a realização deste website foram utilizados os seguintes plugins:

 Booking.com Affiliate Plugin – Este plugin tem como objetivo adicionar a qualquer website criado em wordpress o módulo do website Booking.com;

32

 Contact Form 7 – Este plugin permite a criação de formulários de forma rápida e flexível;

 Easy Columms – Este plugin permite facilmente a criação de colunas em páginas ou artigos de wordpress;

 Goodlayers Hotel plugin – Este plugin é nativo do template, permite que os utilizadores façam a reserva dos quartos, pedindo ao utilizador o dia em que ele fará o check-in e o check-out como também para quantas pessoas o utilizador pretende efetuar a reserva;

 GTranslate – Este plugin permite que os utilizadores mudem o idioma do

website;

 Simple Maintenance Mode – É um plugin que permite ao web designer criar uma página de manutenção, desta forma enquanto ele cria ou modifica o website os utilizadores não poderão observar o website;

 WP Google Map Plugin – Este plugin permite adicionar google maps em páginas ou artigos do website;

 One-Click Child Theme – Este plugin permite facilmente a criação de um

child-theme;

 Page Link To – É um plugin que permite reencaminhar os hyperlinks de páginas ou artigos, para URL’s externos;

 Master Slider Pro – Este plugin permite a criação de um slider, para qualquer página ou artigo no website.

Para a realização deste website foram utilizados os seguintes widgets:

 Menu personalizado – Este é um widget nativo do wordpress, permite ao web

designer criar um menu secundário no website.

 Goodlayers Recent Room Widget – É um widget nativo do template, que efetua um loop dos últimos quartos adicionados ao website.

 Texto – Este é um widget nativo do wordpress, permite ao web designer adicionar informação em formato de HTML a uma área específica do website.

33

 WP Google Map Widget – É um widget externo, ou seja, não é nativo ao

wordpress nem ao template em questão, permite ao web designer adicionar google maps a uma área específica do website.

Após a implementação de todos os plugins, widgets e modificações maioritariamente efetuadas no documento style.css o website foi concluído com sucesso (Figura 11). O trabalho está publicado na página das Casas do Prior (http://www.casasdoprior.com/).

Figura 11 - Website Final (Casas Do Prior)

Fonte: http://www.casasdoprior.com/ - acedido a 06/01/2016

Teste e alojamento – Após a conclusão da etapa de desenvolvimento do website,

foram realizados diversos testes com a finalidade de verificar se todos os parâmetros solicitados pelo cliente estavam em conformidade com o planeamento do website, foi testada também a navegação e a usabilidade do website de forma a verificar se esta, está fácil e acessível ao utilizador. Após a aprovação dos colaboradores e dos clientes, foi efetuado o upload, dos ficheiros para os servidores da StudioBox.

2.8 – Stramus

A instituição stramus é responsável pela venda de joalharia, foi pedido á empresa acolhedora do estagiário, que desenvolve-se uma loja online (e-commerce). O cliente solicitou que este website permite-se aos seus clientes efetuarem a compra dos seus produtos online, para isso o website tem que ser constituído por várias características que

34

permitissem os utilizadores efetuarem esse processo, foi também solicitado pelo cliente que o website conte-se diversas informações sobre a instituição.

2.8.1 - Conceção (Planeamento, Análise e Desenho)

Planeamento – Tal como no subponto (2.7.1), o planeamento foi efetuado

seguindo a metodologia referida no subponto (2.51): 1. Qual o propósito da empresa?

A instituição Stramus tem como propósito a venda e distribuição de joalharia, dando a conhecer aos seus clientes as novas coleções das suas marcas como também oferecendo a possibilidade de estes adquirirem esses produtos, sejam eles destinados para revenda ou para uso pessoal.

2. Qual a intenção da existência do website?

O website da instituição stramus tem a intenção de dar a conhecer aos seus clientes os novos produtos que entram no mercado como também a possibilidade de os adquirir.

3. Quais os objetivos principais?

O principal objetivo da instituição stramus é vender e distribuir os seus produtos. 4. Qual o público-alvo?

O público-alvo da instituição stramus engloba indivíduos em praticamente todas as faixas etárias.

5. Quais as principais características do público-alvo?

A instituição stramus procura um público-alvo abrangente, não limita o seu público-alvo com a sua faixa etária, oferece produtos para todas as idades.

6. Que informações disponibilizar?

A informação a disponibilizar no website da instituição stramus é a necessária, ou seja, tem como obrigação disponibilizar aos utilizadores o catálogo de produtos disponível, como também os seus preços e características adicionais de cada um do produto, uma breve descrição com a visão, missão e valores da empresam como também

35

a sua história, informações em relação às localizações físicas das lojas também irão ser disponibilizadas no website, tal como os contactos de cada uma das suas lojas.

Análise – Durante esta etapa, foi solicitado por para do Bruno Esteves, que o

estagiário realizasse uma pesquisa em relação a websites da concorrência já existentes na

web, desta forma existe uma melhor perceção do tipo de conteúdo e da forma como este

irá ser apresentado ao cliente. Após finalizar a pesquisa e as necessidades do cliente terem sido analisadas, as informações que foram propostas ao cliente (stramus) foram as seguintes:

 A homepage, é constituída por um slider interativo, com imagens selecionadas pelo cliente, uma secção para disponibilizar produtos em destaque ao utilizador como também uma secção para disponibilizar as diferentes categorias de produtos existentes no website ao utilizador, e por fim um rodapé interativo com os diversos testemunhos dos clientes.

 Juntamente com o cliente, e com a colaboradora Susana Esteves foi decidido que os diferentes produtos iriam estar disponíveis nas suas respetivas categorias, de forma a melhorar a experiência de navegação dos utilizadores do website, foi assim realizada uma estrutura de navegação para o website (Fixura 12 e Anexo IV), disposto do seguinte modo: “home”, “sobre nós”, “contactos” e “loja”, no segundo nível de navegação do hyperlink “loja”, poderemos encontrar todas as categorias dos produtos que se poderão adquirir no website, tais como: “anéis”, “brincos”, “colares”, “relógios”, “alianças”, “pulseiras”, “barras”, “medalhas e alfinetes” e “gourmet”, inseridos nos submenus: “colares”, “relógios” e “pulseiras” poderemos encontrar as marcas que o website disponibiliza aos seus clientes.

36 Figura 12 - Estrutura principal de navegação website Stramus

Fonte: Estagiário

Desenho - O cliente desejava um website com um design “limpo”, de boa

apresentação, clara, objetiva, simples com boa usabilidade e com fácil interação. Posto isto, a plataforma CMS utilizada foi o wordpress, pois é nesta plataforma que a

StudioBox realiza todos os seus websites.

No cabeçalho da homepage, está disponibilizado um link para o facebook da entidade em questão, como também os controlos “A minha conta”, “Check-in/Check-out” e o “carrinho de compras”, estes controladores têm como objetivo indicar ao utilizador quantos produtos selecionaram na sua visita ao website, na secção número um foi implementado um slider interativo com dimensões de mil novecentos e vinte pixéis por seiscentos pixéis (1920 px x 600px), a secção número dois foi construída de forma a disponibilizar uma pequena quantidade de produtos em destaque (entre quatro a oito

37

produtos), na secção número três foram disponibilizadas as categorias principais de produtos que a entidade oferece ao seu público, que são as seguintes: anéis, brincos, colares, relógios, alianças, pulseiras, gourmet, medalhas, alfinetes e barras, na seção número quatro foi inserido um slider interativo contendo os testemunhos dos diversos clientes da entidade, no final do website foi inserido um footer onde poderá ser encontrada a mensagem de copyright como também as ligações para as redes sociais da instituição. Após estas informações foi desenhado pelo estagiário um wireframe do website final (Figura 13 e Anexo V).

Figura 13 - Wireframe da homepage do website Stramus Fonte: Estagiário

2.8.2 – Implementação (Desenvolvimento, testes e alojamento)

Desenvolvimento – Na realização desta etapa de desenvolvimento do website foi

utilizada a mesma metodologia mencionada no subponto (2.7.2).

No website em questão foi utilizado o template denominado por: Natural Shop (Figura 14), desenvolvido pela empresa quitenicestuff.

38 Figura 14 - Template Natural Shop

Fonte: http://themeforest.net/item/natural-shop-responsive-woocommerce-theme/full_screen_preview/11047108 - acedido a 06/01/2016

Para a realização de este website foram utilizados os seguintes plugins:

 Contact Form 7 – Plugin mencionado no subponto (2.7.2.1).

 Gold price plugin – Este é um plugin que disponibiliza o preço constante de determinados metais, tal como: ouro, platina e prata.

 Newsletter sign-up – Plugin que permite adicionar diversas formas dos utilizadores do website subscreverem-se á sua mailinglist.

 Simple Maintenance Mode - Plugin mencionado no subponto (2.7.2.1).

 WooCommerce – É um plugin que adiciona opções de e-commerce a qualquer

website produzido em wordpress.

Para a produção deste website não ocorreu a necessidade da utilização de widgets. Após a implementação de todos os plugins e modificações maioritariamente efetuadas no documento style.css o website foi concluído com sucesso (Figura 15). O trabalho está publicado na página da entidade stramus (www.stramus.pt).