Desenvolvimento

4 ago, 2016

Pokemon GO: o passo a passo para fazer o seu – Parte 01

Publicidade

O presente artigo irá detalhar os passos necessários para para criação de um aplicativo nos moldes do Pokemon GO. Para tal, será dada uma visão geral das tecnologias envolvidas e dois tipos de processo de desenvolvimento que podem ser utilizados. Ao final do artigo será detalhado de forma bastante técnica o passo a passo para criação do aplicativo.

O mercado de desenvolvimento de aplicativos cresceu rapidamente ao longo dos últimos cinco anos! Inúmeras vezes, a quantidade de projetos a serem atendidos é muito grande e os times de desenvolvimento ficam sobrecarregados com relação à quantidade de atividades e prazo para a entrega dos projetos. Logo, devido à crescente demanda por projetos de sistemas mais complexos e maiores, o aumento da produtividade e da qualidade global da aplicação são inevitáveis. As duas principais alavancas para acelerar o desenvolvimento de uma aplicação estão relacionadas às tecnologias utilizadas e ao processo de desenvolvimento escolhido.

Tecnologia

Em pouco tempo, os desenvolvedores de aplicativos perceberam que a utilização de plataformas de aceleração de desenvolvimento para criação de projetos de software permite que os mesmos venham a se concentrar em aspectos mais inspiradores da profissão e não mais em tarefas repetitivas e monótonas.

Desta forma, uma quantidade crescente de desenvolvedores realiza estas tarefas de desenvolvimento menos glamurosas, mas não menos importantes, a partir da utilização de plataformas de aceleração de desenvolvimento. As mesmas podem ser divididas em três grandes grupos, os quais contemplam o desenvolvimento do Backend & Frontend de uma aplicação.

  • BaaS – Backend as a Service: A melhor forma de entender o conceito por trás de um BaaS é visualizar uma ponte conectando o backend e o frontend de uma aplicação. Este tipo de plataforma auxilia os desenvolvedores a acelerar o desenvolvimento de aplicações (web e mobile) e simplifica a criação de APIs. Ao invés de codificar o backend inteiro, o programador utiliza a plataforma para criar as APIs e conectar as mesmas às aplicações.
  • Plataformas de desenvolvimento cruzado: Este tipo de plataforma permite o desenvolvimento das diversas versões de um aplicativo, por exemplo, Android, iOS e Windows dentro de um único ambiente e a utilização de um mesmo código fonte.
  • Plataformas de prototipação & design: São plataformas que permitem ao usuário efetuar o design e a prototipação de um aplicativo de forma colaborativa dentro de uma mesma ferramenta.

Processo de desenvolvimento

A metodologia escolhida para o desenvolvimento é tão importante quanto a tecnologia utilizada e a escolha errônea desta pode resultar no sucesso ou fracasso de um projeto de software. As duas principais metodologias para o desenvolvimento de projetos de software são a Waterfall e a metodologia Ágil. Ambas são ilustradas no diagrama abaixo.

poke01

A metodologia Waterfall leva em conta uma abordagem linear do desenvolvimento de software. Na presente metodologia, a sequência de eventos é algo parecido como:

  1. Documentar requisitos
  2. Design
  3. Codificação
  4. Testes
  5. Homologação
  6. Entrega do produto final

A metodologia Ágil é iterativa e baseada no conceito de alocação de times de desenvolvimento. Tal abordagem enfatiza a entrega da aplicação a partir do desenvolvimento de elementos funcionais completos. A figura abaixo ilustra este conceito:

poke02

Ao invés de criar tarefas e cronogramas, o desenvolvimento é dividido em pequenos ciclos de desenvolvimento, que são chamados Sprints. Cada Sprint apresenta uma duração específica e os entregáveis são planejados ao início de cada Sprint. O foco do desenvolvimento é na entrega de uma solução ao cliente final e não em um escopo rígido e inflexível, tal como na abordagem Waterfall.

Ao iniciar um projeto de desenvolvimento, o desenvolvedor deve avaliar qual metodologia é mais adequada para o projeto em questão de maneira que o mesmo seja desenvolvido da forma mais produtiva possível. A metodologia Waterfall pode ser utilizada quando os requisitos do software são claros e existe pouca variação no produto final a ser implementado, quando os clientes não apresentam a possibilidade de alterar o escopo após o início do projeto e quando o escopo é mais importante que a velocidade de implementação.

A metodologia Ágil deve ser utilizada quando os requisitos de software mudam constantemente e são flexíveis. Por exemplo, ao desenvolver um projeto para o uma startup, a metodologia Ágil deve ser necessariamente utilizada, visto que por conta do estágio da empresa, os requisitos irão mudar. Também a metodologia Ágil deve ser utilizada quando a velocidade de desenvolvimento for mais importante que a manutenção do escopo original do projeto.

Criação do aplicativo

Será detalhado como pode ser feito o desenvolvimento de uma aplicação desde seu backend até a produção final do frontend. A primeira etapa a ser definida é o tipo de processo de desenvolvimento a ser utilizado. Como estamos tratando de um game, uma premissa adotada é que a empresa que vai desenvolver é uma startup. Logo o processo de desenvolvimento preferido para este tipo de situação é a metodologia ágil.

O próxima etapa é a definição das ferramentas tecnológicas que serão utilizadas. O frontend é a camada da aplicação que é visualizada pelo usuário final. No caso de aplicativos, esta camada pode ser visualizada a partir de inúmeros tipos de dispositivos móveis com diversos sistemas operacionais, por exemplo, Android, iOS e Windows. A experiência de uso é extremamente importante para o sucesso de um aplicativo e o correto design e prototipação contam muito em um projeto de desenvolvimento e ferramentas como, o Marvel App e Invision são interessantes para se iniciar o design de um aplicativo.

Após a etapa de design e prototipação, caso um desenvolvedor opte pelo desenvolvimento nativo, a codificação deverá ser realizada em cada uma das linguagens que o sistema operacional suporta. Por exemplo, se uma aplicação necessitar ser instalada em Android e iOS, dois desenvolvimentos distintos terão que ocorrer. Já as plataformas de desenvolvimento cruzado permitem a criação de aplicações móveis nativas com compartilhamento de código-fonte e interface de usuário, ou seja, pode-se escrever o código da aplicação móvel apenas uma vez e ele pode ser executado em diversas plataformas. Isso evita a necessidade de se codificar em diversas linguagens de programação distintas e a repetição da lógica. A plataforma mais conhecida para este tipo de desenvolvimento é o Xamarin. A ferramenta foi recentemente adquirida pela Microsoft e sua versão open source foi disponibilizada.

Backend é a camada da aplicação que não pode ser vista pelos usuários finais e no caso de games como o Pokemon GO pode representar até 80% do esforço total de desenvolvimento, visto que as queries para geolocalização muitas vezes são complexas e demandam muito processamento. Plataformas de BaaS oferecem uma forma altamente eficaz de lidar com a codificação do lado do servidor, hospedagem de banco de dados, backup e outras tarefas que criam e mantêm o ambiente de apoio ao desenvolvimento que um aplicativo requer. Plataformas como, Back4app e Parse são boas opções para otimizar a criação de games nos moldes do Pokemon GO.

Abaixo será detalhado o passo a passo para a criação do backend.

Etapa 1. Configurar Back4app e Parse no seu Unity3d

Acesse:  https://parse.com/docs/downloads

poke03

Faça o download do Unity Blank Project (v1.7.0) neste link para o Parse SDK para Unity3d.

poke04

Abra o Unity3d Parse Blank Project -> Aparte o botão Upgrade se necessário:

poke05

Substitua Asset/Parse/Parse.Unity.dll pela sua última versão:

Vá para Asset/Scene. O iniciador (Parse Initializer) GameObject terá alguns scripts faltando. Adicione ParseInitializeBehaviour a ele.

poke06

Crie um GameObject e adicione o Script Component para testar:

poke07

Adicione o código ao TestParse.cs:

poke08

poke09

using UnityEngine;
using System.Collections;
using Parse;
using System.Threading.Tasks;
public class TestParse : MonoBehaviour {
// Use this for initialization
void Start () {
ParseObject testObj = new ParseObject("TestObject");
testObj["a"] = "HI";
testObj["b"] = "Back4app";
Task saveTask = testObj.SaveAsync();
}
// Update is called once per frame
void Update () {
}
}

Pressione o botão Play Button no seu editor Unity3d:

poke10

Vá para a base de dados do Back4app e cheque o sucesso ou fracasso:

poke11

Agora, confirme se sua conexão com a base foi bem sucedida:

poke12

Etapa 2. Integre o Google Maps ao seu projeto Unity3d

Para gerar o terreno como o Pokémon-Go, a integração do Google Maps ao seu projeto Unity3d se faz necessária. Primeiro crie Plane e Name como Mapa e crie uma luz direcional:

poke13

Segundo, crie um script “GoogleMap” e adicione ao objeto Map Game:

poke14

using UnityEngine;
	using System.Collections;

	public class GoogleMap : MonoBehaviour
	{
		public enum MapType
		{
			RoadMap,
			Satellite,
			Terrain,
			Hybrid
		}
		public bool loadOnStart = true;
		public bool autoLocateCenter = true;
		public GoogleMapLocation centerLocation;
		public int zoom = 13;
		public MapType mapType;
		public int size = 512;
		public bool doubleResolution = false;
		public GoogleMapMarker[] markers;
		public GoogleMapPath[] paths;

		void Start() {
			if(loadOnStart) Refresh();
		}

		public void Refresh() {
			if(autoLocateCenter && (markers.Length == 0 && paths.Length == 0)) {
				Debug.LogError("Auto Center will only work if paths or markers are used.");
			}
			StartCoroutine(_Refresh());
		}

		IEnumerator _Refresh ()
		{
			var url = "http://maps.googleapis.com/maps/api/staticmap";
			var qs = "";
			if (!autoLocateCenter) {
				if (centerLocation.address != "")
				qs += "center=" + WWW.UnEscapeURL (centerLocation.address);
				else {
					qs += "center=" + WWW.UnEscapeURL (string.Format ("{0},{1}", centerLocation.latitude, centerLocation.longitude));
				}

				qs += "&zoom=" + zoom.ToString ();
			}
			qs += "&size=" + WWW.UnEscapeURL (string.Format ("{0}x{0}", size));
			qs += "&scale=" + (doubleResolution ? "2" : "1");
			qs += "&maptype=" + mapType.ToString ().ToLower ();
			var usingSensor = false;
	#if UNITY_IPHONE
			usingSensor = Input.location.isEnabledByUser && Input.location.status == LocationServiceStatus.Running;
	#endif
			qs += "&sensor=" + (usingSensor ? "true" : "false");

			foreach (var i in markers) {
				qs += "&markers=" + string.Format ("size:{0}|color:{1}|label:{2}", i.size.ToString ().ToLower (), i.color, i.label);
				foreach (var loc in i.locations) {
					if (loc.address != "")
					qs += "|" + WWW.UnEscapeURL (loc.address);
					else
					qs += "|" + WWW.UnEscapeURL (string.Format ("{0},{1}", loc.latitude, loc.longitude));
				}
			}

			foreach (var i in paths) {
				qs += "&path=" + string.Format ("weight:{0}|color:{1}", i.weight, i.color);
				if(i.fill) qs += "|fillcolor:" + i.fillColor;
				foreach (var loc in i.locations) {
					if (loc.address != "")
					qs += "|" + WWW.UnEscapeURL (loc.address);
					else
					qs += "|" + WWW.UnEscapeURL (string.Format ("{0},{1}", loc.latitude, loc.longitude));
				}
			}

			var req = new WWW (url + "?" + qs);
			yield return req;
			GetComponent().material.mainTexture = req.texture;
		}

	}

	public enum GoogleMapColor
	{
		black,
		brown,
		green,
		purple,
		yellow,
		blue,
		gray,
		orange,
		red,
		white
	}

	[System.Serializable]
	public class GoogleMapLocation
	{
		public string address;
		public float latitude;
		public float longitude;
	}

	[System.Serializable]
	public class GoogleMapMarker
	{
		public enum GoogleMapMarkerSize
		{
			Tiny,
			Small,
			Mid
		}
		public GoogleMapMarkerSize size;
		public GoogleMapColor color;
		public string label;
		public GoogleMapLocation[] locations;

	}

	[System.Serializable]
	public class GoogleMapPath
	{
		public int weight = 5;
		public GoogleMapColor color;
		public bool fill = false;
		public GoogleMapColor fillColor;
		public GoogleMapLocation[] locations;
	}

Desmarque a opção AutoLocateCenter:

poke15

Digite algum parâmetro fictício para testar o Google Maps:

poke16

Se o plano mostra a localização correta como o seu parâmetro, o Google Maps está integrado com sucesso. Você pode usar o método de atualização para atualizar o Google Maps para mudar a localização.

poke17

Na segunda parte do artigo, vamos começar a falar sobre a integração do caractere e a interação com dados do GPS.

Não perca!