Getting Started !

Every challenging task raises the question "How to start?". So happened with me. I thought of various ways to get started.

  • As an initial step, I started peeping into the code base of Inqlude. Since I have an understanding of what inqlude does by now, I started finding inqlude git repository. Yet I found the following two repositories.
1. Inqlude, the Qt library archive at https://github.com/cornelius/inqlude. Inqlude is a tool to handle Qt based libraries. It provides developers an easy way to find, install, and use libraries, in particular third party libraries. A public version of the library runs at http://inqlude.org.[1]
2. Inqlude data repository at https://github.com/cornelius/inqlude-data. This is the repository for library meta data of Qt based libraries for Include, the independent Qt library archive.[2]

  • I determined to maintain a 'to do' list in which I will be adding all tasks, references, tutorials, videos and other resources that I need to look into. I will also be adding there what things I need to do next, so that I can complete them one by one or simultaneously. I hope that this would help me not miss anything by any case. On the other hand, this would definitely increase productivity and I would be able to measure my own progress too.
  • Meanwhile, I thought of creating my draft proposal without hurrying to do it at the last minute. So I started creating it and I managed to jot down different things in point form whenever I find something which is worthwhile to include in it. 

  • I looked into the inqlude repository[1] which is the actual work space for my project. I found that most of the work that I need to implement is within the 'view' section. The views are written in HAML. Each page has an associated html.haml file. I went through the code and tried to understand what languages and templates used in it. I went through the issues list, where I found several issues with regard to the website. I thought of including them in my project proposal to clear them during my project period. Some of the issues were directly related to my project task, so I communicated in those threads as well.

  • Also, I thought of doing an analysis of the Inqlude current website so that I can understand its shortcomings related to search and categorization. I came up with a set of problems, weak points and shortcomings in terms of providing a better user experience. Then I listed them and came up with solutions on my own. I thought of getting other's feedback to justify my solutions and even to come up with better suggestions.  

  • Then I started learning Ruby. As the mentor advised, I started following some online resources to get myself familiarized with Ruby. Currently, I am following these materials.
1. Ruby with some online video tutorials by Jake Day Williams.
2. Ruby with tutorialspoint.
3. Mentor recommended me to follow http://exercism.io/ which helps learning Ruby along with exercises.
4. Haml with http://designshack.net/articles/html/save-loads-of-time-by-writing-your-html-with-haml/

  • Meanwhile, I thought of learning Human Computer Interaction principles via some online material. I hope that this knowledge would be useful to improve my design thinking. I also found some presentation slides on HCI module from my seniors which I will be doing in my next semester. Those slides are based on the book 'Human Computer Interaction' - 3rd edition by Alan Dix - Janet Finlay - Gregory Abowd - Russell Beale. I thought of going through them so that it would be useful for this project.


  • Then I started learning about designing responsive websites. I came up with several suggestions for implementing responsive layouts for the current website. They are as follows.
1. Use frameworks like W3.CSS which is free to use and no license necessary.
2. Set a meta view port tag, create a flexible layout / fluid grid, use media queries in CSS file.
3. Create responsive websites with Django. 

After having these approaches discussed with the mentor, he suggested me to use media queries to design responsive layouts as this is a simple website, so using different frameworks would make it complex. I also think that it is better to use simple approaches for accomplishing targets without making things complex.

In order to learn the usage of media queries with CSS, I referred following materials which explain things very clearly.
1. https://www.youtube.com/watch?v=aPtA4nYkvDw where I studied about creating three style sheets with css configurations for small, medium and large screen sizes separately.
2. http://www.youtube.com/watch?v=ZKy0kIZB9y4 where I studied about screen size responsive dynamic style layouts. There I learnt to program real time CSS layout changes relative to the screen size of the user device or browser window as they re-size it.

I learnt following concepts too.
1. The Viewport
2. Viewport Units
3. Media Queries
4. Navigation
5. The Foundation 5 Grid

  • The mentor asked me to take time and prepare a plan on my project so that I would be able to come up with very good designs for the website. He pointed out me a a good document that explains the process of coming up with a good design. You can find  that document on product design sprint here. 

He also supplied me a document on how he has applied that method to a project he did for his HCI class. You can find it here. 

He proposed me that using a similar approach for the design of the Inqlude web site will give good results. In fact, that was an awesome document, where he has recorded details on how he has come up with UI designs for "I will travel" website. I was amazed by his approach taken towards need finding, prototyping, building prototypes, user testing and finalizing prototypes. I felt very interested with this approach and I understood that success of the project lies mainly on developing good designs which I would be able to derive using this approach.

  • I developed some storyboards and prototypes as well. I sketched several storyboards on paper. Then I came up with several prototypes as well. For that I used two mock up tools called moqups and balsamiq. They were very useful tools to create nice prototypes. 
  • Then I tried to visualize this site locally in my machine. With guidance from the mentor, I was able to view it using 'inqlude view' command. I used different inqlude commands to try out different actions. Then I edited the code to view changes accordingly. 

  • I used inqlude command line tool to see how it works. For that I followed instructions at How to get libraries page in inqlude website. So I  cloned the inqlude-client github code, installed inqlude using gems and installed libraries. 

  • I went through the structure of the manifest files, inqlude-data repo and those respective files. Inqlude manifest format is described in following doc. 
https://github.com/cornelius/inqlude/blob/master/manifest-format.md

  • You can find all data in one JSON file available at http://inqlude.org/inqlude-all.json, which contains the data for the latest version of all libraries. This is the most convenient way, if you just want to have the current data. Yet this was very helpful for me to understand the process.
In these ways, I tried to get some understanding about all components such as Inqlude command line tool, manifest format and website. 

  • While going through all these approaches, I thought of documenting and recording my work somewhere which I always used to do when doing various project tasks. So I maintain this blog expecting that this would not only be useful for me, but for whole open source community who are interested in contributing to "Inqlude".

I hope that this blog post would be very helpful for any one who wish to start contributing to Inqlude. Please add your comments if you have better approaches of getting started with contributing to Inqlude.


1 comment: