CS3216

3 minute read

Right after my summer volunteering with CVWO, I got a job working for Prof Ben on the e-learning platform Coursemology. As part of my training for this job, I was allowed to take NUS School of Computing’s CS3216 Software Product Engineering for Digital Markets.

CS3216 was a course created by Prof Ben some years back, I don’t know exactly when. The first batch listed on its website is 2015, but one of my friends actually took it before that. I guess the course only started collecting students’ photos from 2015 onwards.

The course has been very selective. Every year there would be students anonymously accusing it of being elitist on the university’s confession page. And Prof Ben’s note explaining why they try to make the course selective would again resurface.

The original curriculum included an assignment working with Facebook API, back when FB permission system was super lax. Something like Cambrigde Analytica could have easily started as an assignment in this course, but fortunately it didn’t.

The semester I took it, Sem 1 AY2018-2019, was the first semester Prof Ben had been back to teach the course, after a couple of years away to be Tech Director at Singapore Ministry of Education. He made some major changes to the curriculum, one of which is to replace the FB assignment with a UI/UX design assignment.

For UI/UX assignment I was very fortunate to be in the same group with one of the very few designers in the class. We got to try out the whole design workflow: building the wireframe, conducting the user testing, constantly fighting to get the design right. At the end, thanks largely to the magic that our MVP designer did, we couldn’t be more proud of our final design. Below is the embedded wireframe, feel free to poke around:

For my final project I was again very lucky to get to work with my team lead @elg from CVWO. He and another teammate wanted to build a better replacement for when2meet called ShowFace.io (very Singaporean name, I know). The design had been drawn up and tested by elg’s group for UI/UX assignment. With one additional classmate we formed a team of 4 devs to build the product according to pre-defined specs.

The ShowFace team

The project was an opportunity for some of us to learn and try out new technology in about 6 weeks. So for my first exposure to any frontend at all, including basic Javascript, I worked on the frontend built using React + Redux, Apollo Graphql client, and Firebase for authentication. Being in charge of everything to do with authentication, I got to work with all those things. Trying to get React + Redux and Apollo GraphQL client to work well together was incredibly difficult for a novice like me. This was back when Apollo client used nested components instead of query chaining. Shown below is an export statement from the our project, one which I had to ask elg to help me with.

export default (props) => {
  return (
    <AuthenticatedQuery query={GET_USER_SHOW_QUERY} requiresAuth>
      {(getUserShowsResult) => (
        <AuthenticatedQuery query={GET_USER_QUERY} requiresAuth>
          {(getUserResult) => (
            <DashboardPage
              {...props}
              getUserShowsResult={datifyShowsResponse(
                getUserShowsResult,
                "data.userShows"
              )}
              getUserResult={getUserResult}
            />
          )}
        </AuthenticatedQuery>
      )}
    </AuthenticatedQuery>
  );
};

I got a lot out of working with this team on Showface, way more than I could contribute at the time. I don’t think I have ever experienced a learning curve steeper than the 6 weeks spent working on Showface.

I can’t even say I came out of Showface fully understanding all the technologies I worked with, but I certainly gained a lot of foundation in frontend development from working with masters like elg.

Almost forgot to mention, between Rakkoon and Showface, I also worked on another assignment with elg and another CVWO teammate, Nic. We built some kind of dating/chat app that failed so hard as a product we had to remove all traces of its existance as soon as the course was over hahahah. The tech was alright, React + Redux frontend and Django backend. I believe what failed about the product was the lack of proper product design. Nic, for his final project, went on to build a web console for multiplater games that won CS3216 best project that semester.

Taking CS3216 really taught me a lot about proper development process, about the importance of product testing and UI/UX design. It has certainly influenced my approach to SWE, resulting in my proclivity to place a lot of trust in product and design counterparts.

Categories:

Updated: