And, we also wanted to display live Tweets, so that the heads will pop up everytime, which would be really cool!
This section is divided into multiple milestones. Each problem took considerable amout of time and had a profound impact on the project.
Learning from the pit fall of my last side project, this time, I needed to have a prototype.
And, I needed it fast! In the end, it took me 3 hours, which is not ok
Firstly, we discussed the purpose of the application and determined its features. Then, we drew some sketches and revised them continuously. Normally, during this prototyping process, people took designs from many places and modify them accordingly. I highly recommend using Photoshop/Keynote to modify designs on pttrns and make it interactive with inVision.
Here are the raw designs and their modifications side by side:
Please note that although, it took 3 hours in total, creating the faces with Photoshop took over 70% already. Modifying the designs and creating an interactive prototype took little to no time. Here is a really cool video by Apple about prototyping: Prototyping: Fake it til you make it
In this section, I left out the part when I ran around and asked people for their experience in using the app. That was important too, the final design you saw above was not my first attempt. It had gone through many iterations with feedback. Since, this was my first time doing this, I will save the talk for the next blog, when I have more experience.
This was very simple, the tutorials for it were scarce and mostly in Object-C. You can look through my code, everything should be inside the folder named InfoWindow and the initialization will be inside class MarkerCreator. Basically, you are going to:
Here are some nice materials that I went through:
By far this was the hardest challenge for the entire project. Not only Google Maps SDK did not support the feature, but there was also almost no material on the subject. You can take a look at my MarkerCreator class for the code, but here are the general ideas:
Whenever the user pan or zoom in with the map, we had to send the location at the center of the map along with its radius (pan level) to the server. The server would then send back a JSON object about the Tweets. Also, we did not want to send the locations too often, we needed only sending a new request once every 5 seconds.
In our final project, we did not have the time to dispatch each received tweet asynchronously to display them slowly. But, the program could display ten tweets each time, so that still counted as semi-responsive, right? Lastly, for networking, I used Alamofire and swiftJSON.
Here are some screen shoots of our final project.