Week 6, Relive

Relive, is designed to be a simple site that allows users to view events quickly. If you haven’t done so, visit us now at https://relive.space. Here are some stats from Google Analytics.

Screen Shot 2015-09-21 at 1.00.17 pm

Figure 1. Screencapture of Relive.space Google Analytics as of 21 Sep 2015 1:00PM

We’re all shocked at the numbers. The amount of US visitors has surpassed SG visitors. This number could be attributed due to events such as the Emmy Awards 2015. We’re not quite sure ourselves.


Lessons I’ve learnt for this week

  1. Frontend is painful to get it right

    Having developed on the frontend for Relive for two weeks, I feel that it is pretty difficult to get the exact behaviour working when dealing with web technologies. Thus, to ensure that the current app experience meet expectations, we spent quite a bit of time just to refine such experiences.

  2. Mixing iOS and Android native components
    We have decided to design the site that resembles iOS native look and feel. Through this process, we also included non-iOS native elements like the side drawer. With this, we are getting many feedback that it felt weird with our button on the opposite side of the drawer. That is a challenging problem to solve, perhaps to be looked at when we’re done fixing the bugs.

  3. Debugging is painful too
    I’ve probably spent quite a bit of time trying to figure out why certain JavaScript events don’t get called or hooked on properly. Would be good if I had more experience in this field. Also spent around half an hour figuring out that there was a missing } in one of my HTML Templates. Debugging that was painful, but a good lesson learnt.

Week 5, relive your memories!

Relive your memories with Relive! Our group’s assignment 3, Relive, is designed to be a simple site that allows users to view events quickly. What Relive does is to display human readable event titles, while allowing users to enter the hashtags related to the event to get these events generated.

relive branding


Relive is live at https://relive.space

Why would this matter?

We’re essentially opening the content of social media streams such as Instagram and Twitter to the general masses. Not everyone knows to use Twitter to look for latest updates for a particular event. It is probably not easy to keep track of the latest hashtags for a particular trend or event unless you’re a frequent user of Twitter, and following tons of people who tweets about them. Our goal here is to make it simple for everyone to contribute on new happenings, as well as to quickly see what’s available, or what has happened in the past.


What I have learnt this week.

First, it wasn’t an easy task to come up with an idea worth doing. We deliberated pretty long, taking up around 8 hours before finalizing on the idea. I’m quite relieved that we thought this through slowly, as we may have tried to work on an idea that wasn’t going to work.

Next, we had some initial struggles to decide on the stack due to our inexperience with mobile web app development. Our goal was to create an application that felt native enough, and perform well on the mobile devices, thus requiring lots of consideration on the stack. Deciding on a stack, with proper justifications, is not easy.

Lastly, I’ve learnt that it is possible to get 4 guys working on different components, and coming together to integrate smoothly. This has probably been quite smooth for us.


More information on Relive in the upcoming week(s)!

ExchangeHunt? Happenings in Week 4.

Assignment 1, DONE!

What is ExchangeHunt? 

Imagine a portal for connecting exchange students with local students in an institution. That is what ExchangeHunt is for.

It is also an application made with much love for CS3216.

You may visit ExchangeHunt here (https://exchangehunt.io).

I took the chance to make use of another group’s assignment, NUSProjects, to display my group’s assignment. Click here to visit ExchangeHunt showcase in NUSProjects


Happenings in Week 4

tl;dr version: My team and I managed to pull it off and I am grateful for the experience!

Some background about my team for assignment 1…

We’re a team of 4, comprising of 1 from the School of Design and Environment, Seiyee, 1 from Business School, Mei Lan, and 2 from the School of Computing, Jingwen and myself.

I would really like to thank my team members for being such great members.  These guys dedicate their time and effort with no questions asked, no complaints. Thank you!


So, two developers? What’s going on? Tell me more about it.

2 developers, only 1 with prior background with web application development, Jingwen. I had to learn from scratch. I’m glad I did as I have picked up many valuable skills in web development. A slow start, and somewhat strong finish for me. Huge thanks to Jingwen for kickstarting the project. Here are some graphs from our Github Repository.


Screen Shot 2015-09-04 at 11.28.04 pm

Number of commits: 361

 Screen Shot 2015-09-04 at 11.28.28 pm

Amount of codebase over time per developer

Screen Shot 2015-09-04 at 11.29.17 pm

Commits per week, over three weeks

Screen Shot 2015-09-04 at 11.29.30 pm

Punchcard for our final week

What are your personal thoughts?

On assignment 1…

Very good experience working in a team with members of different disciplinary.

On the subject of having only 2 developers…


It is easier to communicate and get things done between the two developers. No conflicts, and sometimes we don’t even strictly define ourselves as the in-charge of frontend/backend. We do everything, both frontend and backend.


Completing this assignment with 2 developers = lack of sleep. We definitely did not get enough rest and barely managed to complete our features. There is hardly enough time to refine every component, let alone writing automated test cases!

Chunks of bad coding are bound to happen as we’re scrambling to get things done. Do check and balances! Review each others components after a branch was merged in.

Yeah, we use branches even with only two developers. 0 issues with Git, awesome! 😀

Key lessons from assignment 1, and week 4.

Sleep is important. Be motivated, stay motivated, and finally finish strong.

Ask me anything!

My 2 cents regarding Facebook Messenger

As most of us would have known, Facebook is a social media platform widely used in the world. Initially, it started only with a simple chat side bar that lives on Facebook itself. Today, it has its dedicated Messenger site (https://www.messenger.com), as well as native applications on the mobile devices such as Facebook Messenger for the iPad.

Although this post would focus on Facebook Messenger for the iPad, it may use comparison with the other Facebook Messenger clients like the web messenger service.

The three main points, along with some original thoughts, that I would talk about are listed below:

  1. Inconsistency in UI
  2. Keeping users in the Facebook Ecosystem
  3. Building on cool plugins inside Facebook Messenger


Firstly, the notable inconsistency in UI throughout the application was what the team has pointed out, that UI on the top navigation bar is rather inconsistent. Can it be completely resolved? We’ll find out.


Figure 1. “People” tab


Figure 2. “Groups” tab

Shown in figure 1, the buttons were represented with flat icons that represents the buttons’ actions clearly. (Search on the left, Add on the right) However, shown in figure 2, the buttons are now represented by text at the same areas, but on different tabs. Inconsistent!

The text could have been replaced with similar flat icons to address the UI consistency, as well as to save on the amount of effort translating to tons and tons of languages to make sense to those who don’t understand english.


Figure 3. New “Groups” tab with flat icons

As visualised above, the two icons would mean the same thing for the same action. Simply more intuitive.

However, finding the right icon is never easy, and might confuse users instead.


Figure 4. “Settings” tab

What would be a good icon to represent Edit? Even Apple does not know. (Check out the stock Mail/Photos application on iOS)

Anything resembling a “pen” would fail as it would look very similar to a “Create new chat” icon as shown in Figure 5 below.


Figure 5. “Recent” tab

Next point, creating a Messenger application to keep users in the Facebook Ecosystem. In this time and day, instant messaging is prevalent. Since Facebook is already a very social centric platform, it should develop their own messaging platform so that users will leave Facebook less often. This keeps them at least with competitors out there, and leaves very little space for new platforms to emerge in a short period of time.

Finally, building on cool plugins on Facebook Messenger is pretty interesting as it lets developers work on interesting ideas that can be plugged into Facebook Messenger, rather than to compete directly by spawning a new service such as 3216 Messenger. The key idea is to have a unified system, but have different providers of content.

It is a brilliant strategy to keep developers busy on creating content for them. And as mentioned, some of these content providers would become viral as if they’re good, they often spread fast.

To end off the post, I would like people to note that Facebook has been developing on their own virtual assistant, “M”, and building it into Facebook Messenger itself. Smart! Another cool way to keep users hooked onto their ecosystem.


Figure 6. Facebook “M” for Facebook Messenger

You know, accessing Siri is not exactly very intuitive… and sometimes I don’t wish to speak to my phone. Even when I do speak to my phone, having my phone recognise my speech accurately is another issue. I would think that Facebook has the right direction on this one! Just hope they pull it off well. 🙂

What I have learnt this week (Week 3)

Apart from Growth hacks, I have learnt many things throughout my web development. As it probably my first time building on the full stack, I have no choice but to give myself crash courses of the frameworks my team are using; Ruby on rails, PostgreSQL, jQuery, React, Materializecss.

Crash courses allowed me to create simple applications for that particular framework. It did not allow me to understand the big picture where multiple frameworks are to be used together.

Through this week, I have met problems which I am eager to solve, and immediately went “Hey I could do that!”. Only to realise I would not be able to directly apply what I have learnt as you might have known, you can’t do Rails in React, similar vice versa. Not directly of course. This was probably one of my largest learning curves in a short span of time. How challenging!

Sometimes, the frameworks just don’t play very nicely together. For example, some code from Materializecss does not get rendered properly when rendered from React. (That has since been fixed, thankfully.)

It has been a great learning experience, and I am constantly trying to build up my components as proper as they should be while getting guidance from my group mate, Jingwen. (Really huge amount of help from him!) Hope to get the core functionalities done on time for the next review. Finally, a huge thanks to the rest of my group members for being so responsive. (I’m quite guilty of summoning them at the last minute for a meeting during the weekend.) Thank you.

Growth Hacking, ???, Profit!

Had a really inspiration talk on Growth Hacking earlier this week. To have an idea that costs you $0 to build other than man hours, spending $0 on marketing, have it downloaded by tens of thousands of users in a short span of time in a saturated market without using some big publisher’s name? Here’s where Growth Hacking can help. I will be discussing on some key points that I have noted over this inspiring seminar.

First off, you probably need to get your product to work, and be of a certain quality. You wouldn’t want to give people a bad image of your application.

Next, focus only on your target audience. Don’t complicate things! Just because you can overload it with confusing features. I tend to agree with this. It is usually super hard to execute big plans properly. Even if you do, the idea might not sustain and people will move on to the next big product.

It is important to get your application validated, and fast. Plant in some form of analytics if you must in order to gain some insights of how your users are reacting to the application. Understand what went well, and what did not. This allows you to improve on your application for the users.

Finally, get your application out there using countless amounts of methods! These include planting seeds in your initial phase, planting them in discussion forums specific to your application, reviews, and even targeting posts like “Paid->Free” highlights of the week.

My favourite of all was the idea of coming up with an enticing clickbait title to attract even experienced reviewers to raise an eyelid at your application.

All that is left is to come up with a better implementation of an application, or think of a new idea that would get people interested.

Second week in… the calm before the storm?

This week, we learnt about several types of life cycles in Software Engineering. It was intriguing to get a brief overview of the development scene in actual, large corporations. Through the lecture, I have been constantly reminded about how projects can often be invalidated before the end of the cycle, and reinforced on the idea of user validation.

In a large scale production, there are hardly chances to execute agile, thus waterfall might be the norm. With waterfall, you won’t be able to get constant feedbacks from the user, thus it is important to fully understand what the users actually require.

Although understanding the users needs is important, sometimes the users are unsure of what they want/need. Even in the waterfall model, I would think that being able to quickly prototype some samples would be important before actually diving in for weeks/months.

As a relatively new developer who has only worked on small projects, I don’t have a clue on how large a large scale project is. Would one have the chance to develop a functional prototype, or would it be too much to create? Would you be able to suggest features/amendments based on what you (and your team) thinks should be done?


PS. Actually, the storm has arrived.

First lesson of the semester!

So I just had my very first lesson of the semester last evening, and I couldn’t have asked for a better start to the semester. Coincidentally, my first lesson was CS3216.

I suppose I did not expect the lesson to last till 11 in the evening. Nonetheless, it was an enjoyable evening as the first lesson was not filled with boring admin matters and ended off with that. Instead, we were engulfed with stories which tries to bring out our adventurous spirit for the semester (and the future to come).

Through the first lesson, I felt inspired to take a few moments on my own to revisit and re-evaluate some of the ideas I have had in the past. More importantly, to objectively validate whether I should move forward with any of those ideas.

Also, I tend to agree that we should always validate the idea/app with the users, as they are the ones that would ultimately make the application survive. There isn’t much of a point to create something that only I find value in while not adding value for others. Or, if the execution of the application is a hindrance to others rather than an integration to their lives.

Finally, I think that the superheroes + show-and-tell segment accelerates the process of understanding our personalities to find people whom you think you may work well with. This then facilitates the creation of teams with less random picks.


What I hope to learn in CS3216

Having gone through CS3217 in the previous semester, I have overcome many hurdles in a short period of time. In the process, I have realised how deep I sunk into the project with too much motivation to accomplish a great product.

For CS3216, I wish to better manage my time while keeping up the high standards that would be expected of us, so that I would not neglect my other modules as much. Thus, I hope to be able to find the right balance, and having proper team management, while juggling with my other modules.

Also, coming to CS3216 with little experience of web application development would be a new kind of challenge and it will be an exciting journey while visiting multiple cool ideas from the rest of the team. Instead of limiting my options from the start, I wish to be objective through this journey, carefully pick out the best idea, discuss and finalize on a project.

At the same time, I hope to be more venturous and not be afraid to explore various technologies so that the product would not be limited to certain use cases.

Hopefully, at the end of the day, I hope to have the ability to, effectively, create something that would be helpful to the masses in one way or another.

Hello world!

Welcome to your new Blog.nus site. This is your first post. Edit or delete it, then start blogging!

Please remember to the Terms of Service:
1. Please use the blog for academic, educational, research and administrative purposes only.
2. Please adhere to Singapore laws and the NUS Acceptable Use Policy for IT Resources: http://www.nus.edu.sg/comcen/security/aup/
3. The Centre for Instructional Technology and National University of Singapore are not liable for any legal or financial issues which may arise as a result of your use of Blog.nus.

Also, a few disclaimers:
1. Content on Blog.nus and all blogs hosted on Blog.nus contain opinions which may not represent the official views of the National University of Singapore.
2. The Centre for Instructional Technology and the National University of Singapore are not responsible for the content of external internet sites. Such websites are subject to their own data protection and privacy practices and you are encouraged to examine the privacy policies of those websites.

We hope you enjoy your new blog.