GSoC 2016 Winds Down


Google Summer of Code 2016 has come to an end. And yes I am satisfactory to a certain level that I have produced something tangible and all of you are able to access that. 

Everything about GSoC had been awesome from the day one until the end. I feel that’s the best thing that ever happened to me, contributing to an open source project while learning tons of things regarding new technologies and best principles of coding, gathering remarkable experiences and and getting into the community, all had been very useful to me. On the other hand, I am glad that my effort had been really merged in to the production. 

During this week, I have been testing the website whether it functions properly as intended, and then documented all my work so that they would be useful for people who wish to contribute in future. 

GSoC is awesome

Everything about GSoC had been awesome from the day one until the end. I feel that’s the best thing that ever happened to me, contributing to an open source project while learning tons of things regarding new technologies and best principles of coding, gathering remarkable experiences and and getting into the community, all had been very useful to me. On the other hand, I am glad that my effort had been really merged in to the production. 

Another important thing that I find with GSoC is that I had been working and contributing to an existing project, so I had to undergo a learning phase first to understand the code base, then adhere to those coding styles, technologies and tools to get the work done. That is something challenging than developing something from scratch and that’s definitely an awesome experience when we find that our code really works. 

The other most important thing that I really feel very happy is to work under the guidance of a great mentor who has taught me lots of very useful things which are technical as well as non technical. My project would never be successful if I had done it in my own way which I am used to do everyday. His motivation let me think out of box, made me more encouraging and at the end of the day, I learned lots of interesting things. I believe that having a very generous, helpful and interactive mentor is a key factor for GSoC. The last few months had been a wonderful internship for me and I am really grateful for KDE community and Google for offering me that opportunity. 

Although it is Google SUMMER of code, being in a tropical country it's always like summer in Sri Lanka. Hence we do not get any special holidays for summer and I have gone through this competition while attending the university and doing various university assignments as well. With the limited time I have had, I am happy that I was successful in managing the time to get this project up to this state and I feel contented about it. Infact I am happy about every task that I did during my GSoC project.

What I learned

The journey up to now has not been easy because I had to learn a bunch of new technologies and have met up with a number of issues during coding and integration. 

The main thing that I learnt is doing a design oriented project using an approach that uses more design thinking. During this, I learnt lots of HCI principles related to usability. Each phase of the project had been implemented methodically so that I improved myself step by step. It had been really interesting to get the ideas and suggestions from the actual audience that use the website, which in turn taught me lots of valuable things. 

The code base had mainly used Ruby, which had been a completely new programing language for me. I learnt lots of things related to Ruby community like using Ruby gems and so on. During this project, I learnt Ruby basically and also learnt other technologies like Haml, HTML, Javascript, jQuery, CSS, Bootstrap, Nokogiri and many more. 

I also learnt about testing, which is a very important part of every project. During this project, I underwent behavioral driven development with unit testing and integration testing. I learnt how to use Rspec, Nokogiri, Capybara etc.

Then I learnt about inqlude command line client and contributed to that as well. UX is something which I love to do, with this project I learnt lots of things about front end web development as well. 

Some very important additional things that I learnt during this project are using the Inqlude workboard in Phabricator, using Git for version controlling, documenting the work, maintaining a blog, communicating with the mentor using emails, video calls etc. All these things would definitely benefit me in my future career as a software engineer. 

Work report

Repositories (Master repositories: All my work are merged to the following)

Inqlude [commits]
Inqlude-data [commits]

Documents:

Project work summary
Blog

Resources

Inqlude project on KDE's Phabricator
Workboard

Design phase

Observations
Inspiration
Storyboards
Interactive prototypes


Even though GSoC has come to a pencils down, my contributions to KDE community and Inqlude project will not halt. And here onwards I will start contributing more and more to the Inqlude project as a member of their community. With the help of my mentor Cornelius Schumacher, I was able to do a good job for the open source community. Thank you Cornelius Schumacher, KDE community and Google.



Test, validate and implement


The next phase of the project was about building a more functional prototype, which could be used for user testing and then learning. This gave some valuable input on how to improve the prototypes and where to focus when building the next step. Hence, the website had been improved bit by bit by taking the comments and suggestions from the mentor. This was kind of a peer review approach. Additionally, suggestions from the audience have also been considered to improve the layout. 

First of all, we realized that the `inqlude view` command should get an option to render with an alternative template. This can be used to implement the changes to the web site without making them to be used in production immediately. It could also be used to implement various alternatives and switch between them. Accordingly, we modified the `inqlude view` command to add a new option called `--templates` to generate the static HTML views from a directory defined by the user. With that, we could independently modify the layouts and generate the pages from different templates. Currently, we have two options for this parameter, they are `one-column` and `two-column`. Moreover, this had been validated, so that when use calls `inqlude view` with a `--templates` parameter with a non-existing directory, there should be an error message telling the user that the templates directory doesn't exist and inqlude should not try to generate the views. 

Then we started redesigning the website. I always tried to keep the new layout similar to the previous one, so that regular users would not get confused. Actually, what we really wanted was to improve the existing site by adding new features and eliminating unwanted features. It was also important to keep the site more consistent throughout all the pages. Hence all the pages of the site had been designed to stay consistent with the colors, font styles, font sizes, headings, alignments and other significant formatting of the home page. 

The task had been easy with template structure brought with Haml. Haml (HTML abstraction markup language) is based on one primary principle: that is markup should be beautiful. It’s not just beauty for beauty’s sake either. Haml accelerates and simplifies template creation as well. Thus using Haml templates had been useful for the cleanliness, readability and production speed of the website. 

Few features and functionalities of the website are implemented in JavaScript and jQuery. Some of those features are search, addition of comments etc. 

Moreover, each and every component that are used in the website have been planned in detail, then implemented and reviewed by my mentor. The functionalities have been validated properly using testing. With that, we concluded most of the project work. 



 

Prototype


In this phase, I tried implementing a prototype of the design that we finalysed. This was a very interesting task. I considered several things when designing the new layout. Some of them are using a grid layout which is also responsive, keeping the site simple and clean, using adequate amount of space, applying HCI principles related to usability etc. 

Let me show here some of the layouts that I developed. 

Home page:












Library details page:















Topics page:














  

Understanding the file structure of Inqlude


Prior the implementation of the initial prototype, it was required to have a clear understanding of the existing file structure and code of the repository. The project repository can be found here. This is written in Ruby along wih few other technologies to implement several features.The types of technologies used are,

  • Ruby for implementing the logic
  • JavaScript and CSS for font end development
  • Rspec for Behavioural Driven Development

The project repository consists of the inqlude command line client and inqlude website. The main logical implmentation can be found in scripts at `lib` directory. 

The `data` main directory contains two exmaple patches for a manifest.

The format of the JSON files for manifests are defined at `schema` directory. That contains three example manifests for `generic manifest`, `release manifest` and `proprietary release manifest`.

Rspec testing is implemented at scripts in `spec` directory. This consists of unit testing, integration testing. Some exmaple data is added to a folder called `data` inside this directory.

The `view` directory contains the scripts for the views of the inqlude website. 

Every code segment that is logically implemented at scripts in `lib` directory are tested using test cases at scripts in `spec` directory. 

There are main classes for library, manifest, manifest_handler, cli, json_object, verifier, view, settings etc. 

The inqlude command line commands are easy to use. More information about inqlude commands are found in one of my previous blog posts. 

Testing the modifications for the website can be easily viewed using static html files that are generated using `inqlude view` command.

Yet coding is fun with Ruby ..... Looking forward to lots of contributions ....


Manifest Updater

One big task of our project was to add a new categorization based on topics for libraries. By analysing the libraries, we categorized them into different topics. We came up with an initial draft for that in an Excel sheet. That can be found here.

Then we cleaned it further into a csv file. Once we are done with that, we required to update the manifests with new data. But updating metadata of 204 libraries is not an easy task which can be done manualy, beacuse there are several manifest files inside each library. So we required some mechanism to automate this process of adding topics into the libaraies.

I came up with an idea to develop a node.js tool to add topics to the manifests automatically. This tool can be found here.

The tool contains a node.js program to update the manifests with topics from the `topics.csv` file. The tool can be run by following the instructions given below.

  • Install node.js and npm.
  • Copy the library folders that contain the manifest files required to be updated and paste them at manifests directory and update_manifests directory.
  • Run npm install from this directory.
  • Then run node app.js from this directory.
  • You will find the updated manifests at update_manifests directory.

Several important things are required to be noted here.

  • You should have the `topics.csv` file in the same directory that contains `app.js`.
  • Having the manifest files at `manifests` directory is adequate, but make sure that you have the same library folder structure at both `manifests` directory and `update_manifests` directory.
  • Also make sure that you have the details for the required update activity at `topics.csv`.

Using this tool, we could easily update all the manifests with metadata about the topics that they belong to. With this, we finished another milestone of the project.




Converge


Not every idea is actionable or feasible. Only some will fit the situation and problem context. Narrowing down the design to the most viable solution happens at the third phase. That is about consolidating ideas and distilling realistic solutions. This includes taking decisions about solutions.

After all the main goal of this phase is to define a minimal viable product and decide what to test and prototype. 

Consolidating the ideas

Taking into account all of the possibilities exposed during earlier phases, we condensed the ideas that we feel the best about. For that, we carried out the following tasks. 
  • Gather a list of the most viable features based on peer reviews, analyze and criticize results
  • Identify conflicts
  • Eliminate solutions that can’t be pursued
  • Hone the list down to a minimal viable product
  • List out assumptions
  • Identify how each assumption will be tested
Some most promising ideas we found are as follows. 
  • Better search with more meaningful results.
  • Adding categories for libraries, where a library can potentially have more than one category. This probably will also include a way of filtering of the libraries based on multiple selection of topics. List of proposed categories is at https://github.com/cornelius/inqlude/tree/master/topics.
  • Highlighting new releases in a way which shows activity and gives users an indication what is active and popular.

Refining the sketches

After choosing a concrete direction, we jumped into the process of wireframing by creating some interactive prototypes that varied in interface, but offered the same basic functionalities. I used a program called Balsamiq to create interactive pdfs for the Inqlude website designs.

I made more designs and refined them further by getting them peer reviewed with my mentor. Iteration upon iteration, I adjusted the designs getting to the details while improving and refining them. These iterative designs are available here.

With that, we concluded the Converge phase of the product design sprint.


Diverge


We have successfully finished the first phase of the project, so we are now moving to the second phase. This is about creating ideas on how to address the needs of the users. It's about quantity, about thinking broad and wide, about generating a lot of input in a short time. This phase incudes iterative sketching and storyboarding.

Iterative sketching 

As this phase focuses on brainstorming and getting ideas out, we needed as much inspiration as possible by creating sketches of various possible solutions. A process of divergent thinking has been used to come up with different types of quick sketches on paper. Some of them are shown below.




More sketches are available here.

With these interative sketches, we figured out following features to be very interesting.
  • A list of latest releases gives some good content on the front page and addresses a direct users need.
  • The mouse over to show additional information such as maturity or latest release or when data was updated.
  • Some welcome text is great
  • Showing all libraries on a single page allows browser search to work across all libraries.
  • Moving the links how to get libraries, how to contribute etc. into the side bar of the web page would be great.
  • Using a symbol to indicate the platform is a powerful concept.
  • Showing the number of libraries per each category could be good information.
  • Sorting by release date could be a good way to give libraries some order and indicate activity addressing the issue of users needing to know which libraries are the good ones.
  • Should be visually appealing. Having filters styled in some nice way could be attractive. Maybe it would be nice to have labels on the list of libraries which resemble the style of the filters, so that you could visually tell, what belongs where.

Storyboarding

Using the inspiration collected from the previous phase, a set of storyboards has been created to come up with different design ideas that address the point of view. These storyboards demonstrate the work flow of what different interfaces do and how they are used to accomplish tasks in a real usage scenario. For example: work flow of somebody using the web site to find a qt library. Some of the storyboards are shown below. 





More storyboards are available here.
With that, we concluded the diverge phase of the product design sprint.


Understand - Inspiration



I looked around and found some interesting sites which are related in some way to the topic of finding libraries or applications to get some inspiration from their designs. They could be taken into account when coming up with a good set of designs for Inqlude. Following are some interesting features I examined.

Qt-Apps.org : Community portal for Qt applications software

  • Provides an easy and interesting way to find Qt applications
  • Comprises two types of categorization of the available Qt applications; one based on ‘Latest’, ‘Alphabetical’, ‘Highest rated’,‘Most downloaded’ and another based on the type of application
  • List of applications along with a screenshot, name, type, version, number of comments, number of fans and a score representing the rating
  • The details page includes important information like summary, description, version, changelog, license, download links for different platforms, screenshots, score and minimum required Qt version

The Ruby Toolbox : A comprehensive catalog of Ruby and Rails plugins, gems and projects

  • This is a website that contains most of the features that we have been looking into, in fact it provides lots of inspiration
  • The website is very clean and has a very organized layout, utilize very few colors (basically white, gray and black) and nice formatting
  • The titles of the main pages and the search box at the top ribbon of the website are well noticeable
  • Home page contains separate sections for announcements, recent comments, latest resources, most popular projects, recently added projects and recently added categories. All projects and resources listed under these separate sections are linked to their details pages.
  • Mouse hover on a project name creates a popup box providing a brief description of the project
  • Categories by group: provides a very broad classification with main categories branched into lots of subcategories
  • Highlighting a row of the list on mouse hover makes it easier to find relevant information
  • Categories by name: a separate page to display all the categories and subcategories grouped according to the different letters of the alphabet taken in alphabetical order
  • Projects by name: a separate page to display the list of projects grouped according to the different letters of the alphabet taken in alphabetical order, selecting a letter filters the projects starting with that letter
  • The entire website utilizes a consistent set of formatting (styles and graphics) which does not distract the user
  • The details page of an item provides a brief summary and links to website, reference doc, wiki, source code, bug tracker and mailing list. Mouse hover on a particular link pops up the address of the link
  • The details page also contains some other important information like number of releases, current version and date of the current release, date of the first release etc.
  • Few small icons on top of the details page; icon of a heart provides an option to like that particular item and an icon of a comment displays the number of comments for that item.

Libraries.io : The open source discovery service

  • Monitors open source libraries across different package managers
  • A very big search box placed at the top of the website. The inner text of the search box explains user about what that really intends to do
  • Short and sweet description of the website. More details provided via ‘What is Libraries.io?’ link
  • List of applications along with name, logo and the number of projects that it has been used with
  • Categorization of the available libraries using languages, licenses and keywords

cdnjs : Host all the popular libraries - JavaScript, CSS, SWF, images

  • Has separate pages for About, Browse libraries, Support us, Source, Git stats, Network, Chat and Request a library linked from the home page
  • A large search box with an inner text of 'Search from 2195 libraries...' is placed at the center of the home page
  • Browse libraries page contains a table of libraries with two columns for library name and link. Every two consecutive rows has two different colors (white and gray) to display the details of each single row clearly
  • The details page of a library contains important information like summary, version, links to the source code and tutorials and related tags

Qtsoftware : Web shop will ease your ordering of Qt software

  • Provides an easy and interesting way to find Qt software, but more specifically designed for ordering purposes
  • Implements a product search where user can either type the name, keyword or narrow down the product search by filtering using the product category and manufacturer
  • Consists of categories and subcategories of Qt software
  • Has an option to sort the list of software using title and price

manjaro.org : Latest news about package updates

  • Consists of a nice categorization, all categories are listed in a drop down menu
  • Elements under each category can be filtered under 'Latest' and 'Top' subcategories
  • List of the search results are shown in a table with columns for specific attributes
  • Search results are shown along with their tags
  • A color scheme has been utilized for different categories

CPAN : Comprehensive Perl archive network

  • Has separate pages for Home, Authors, Recent, News, Mirrors, FAQ and Feedback linked from the top ribbon of the home page
  • Logo of the website and a search box placed at the center of the home page
  • Search by 'Modules', 'Distributions', 'Authors', 'All'

Webstatsdomain : Analyzes data about domains and keywords

  • Search by key phrases
  • Search by ticking multiple options as required and narrowing down the list of search results
  • Categorization as ‘All’, ‘Social’, ‘Search’ and ‘Advertisement’
  • List of the filtered results are shown along with the domain, title, country, rank etc. 

Understand - Need finding via Observations


Watching how people do things is a great way to learn their goals, values and preferences and come up with a design insight. This is known as need finding. I chose ‘glance’ as my design brief. 

Audience

To start with, I had to define the audience of the Inqlude website.

  • Primary target audience of the Inqlude web site is Qt application developers, who are using or are looking into using 3rd party Qt libraries in their applications. Inqlude helps Qt application developers to find Qt libraries that match their requirements.
  • A secondary target is Qt library developers who want to publish their libraries. Inqlude can also be considered as a central place for them and the web site should provide an entry point for library developers which helps them to publish their libraries.


Need finding

This is about discovering what people need by observing them performing some kind of an activity with Inqlude. We have observed how people try out Inqlude to get their work done. 

Observations

We observed few people trying out the current Inqlude website, noted down the breakdowns and interesting moments to identify the user needs properly.

User 1

I observed User 1, trying out Inqlude for the first time.

As soon as she navigated into the website, she started reading the description of the main page. She highlighted few phrases of the main description.

Then she navigated to the details page of 'attica' Qt library and went through its different attributes, basically the library description. She looked into the comments section and then tried out the 'Read more' links. She spent few seconds going through the tutorial link. She had a quick look through the source code repository too.

Then she returned back to the home page and scrolled down through the list of libraries. She stopped at several libraries to read their summaries.

In the meantime, she referred the page on 'How to get libraries' as well. She clicked on ‘How to contribute’ link, but she did not show any interest to go through that entire page.

User 2

Then I observed User 2, finding a plotting library through Inqlude to visualize some graphs and charts.

Similar to User 1, he also started reading the main description of the home page first.

Then he scrolled down through the list of libraries under ‘Stable’ category. He had a quick look across different lists under different categories.

While going through the list, he found a library called ‘qwtplot3d’. He opened its details page in a new tab. Then he opened its home page and spent few minutes going through the content of the home page, basically the features of this library. He also referred the API documentation link, but was not very happy with that.

So he typed the phrase ‘plot graph’ in search box and then found the link to details page of ‘qcustomplot’. He read the content of that page curiously. Link for the source code repository popped up a 404 error message. But the home page of the library was a very attractive and clean website. He could easily find all details about that library there. He had quick view through different pages of this website and started trying out some screenshots in the Introduction page as well. He looked into their respective codes, tutorials and found very happy with it.

Mini Usability Test

We have also carried out a Mini Usability Test to collect more observations from several Qt users. Results are at Mini Usability Test Results.

Interviews

Furthermore, we expanded the process of need finding by contacting and interviewing few Qt interest users at interest@qt-project.org. Listed below are some of their general comments.

User 1





  • Has a good categorization, good to add some subcategories
  • Already possesses a nice formatting of the website
  • Some sort of filtering on type could be nice (data handling, image processing, 3rd party connectors, etc...)
  • Found some interesting libraries, but as the list gets bigger, it will be harder, especially having to search through all of them every so often
  • A timeline of added libraries would be useful
  • Screenshot of any library that adds UI components would be nice
  • A rating system could be nice to have a little confidence that the library is useful
  • Love the idea of this website, hope it becomes a central place to find libraries, as it can be very hard to find otherwise

  • User 2

    • Very nice and simple layout
    • Good readability of the text
    • The categorization should be more plastic, like to see a tag system
    • Good to have a categorization by C++ only/QML Only/ C++&QML and a breakdown by category (Network, Reports, etc.)
    • Could add some missing information (Qt versions compatible with the library, explicit set of platforms on which the library is supposed to work, meta-packages groups, dependencies etc.)




    Project Work Flow

    Project Resources

    1. GitHub repository of command line client for independent Qt library archive http://inqlude.org/
    2. GitHub repository of library meta data for independent Qt library archive
    3. Inqlude project on KDE's Phabricator
    4. Workboard

    Resources for design work flow

    1. https://robots.thoughtbot.com/the-product-design-sprint
    2. http://cornelius.github.io/iwilltravel/

    Product Design Sprint


    A Product Design Sprint is a technique to quickly design, prototype, and test the viability of an idea, product, or feature. We are applying that knid of design thinking inspired approach to the design and implementation of the new navigation structure of Inqlude. It consists of six phases: Understand, Diverge, Converge, Prototype, Test, Implement.

    1. Understand

    The first phase frames the project. It's about understanding who and what needs should be addressed and what is the context. It's about empathy with the user.

    2. Diverge

    The second phase is about creating ideas how to address the needs of the users. It's about quantity, about thinking broad and wide, about generating a lot of input in a short time.

    3. Converge

    The third phase is about consolidating ideas and distilling realistic solutions. This includes taking deciding about solutions.

    4. Prototype

    The fourth phase is about creating something which can be tested.

    5. Test

    The fifth phase is about testing and learning.

    6. Implement

    The sixth phase is about deciding on the final solution and implementing it.







    Finding new releases


    Finding new releases of Qt libraries can be quite challenging. Some libraries have no releases, whereas other libraries are updated and new versions are released often. Later type of libraries have stable releases which come with some release process, testing, release notes and announcement.

    The libraries which have not released anything yet are marked as unstable in Inqlude and they only use the generic manifest. The libraries which have specific releases consist of a release manifest for each release.

    In most cases, home page of the project announces the releases. Some projects have releases indicated in their version controlling system too. All of this would depend on the project.

    Listed below are some ways to find new releases of Qt libraries.

    1. Project home page

    There are some projects that announce releases on their home page. For eg: Qtav library announces all the releases under 'News' section at its home page.

    2. API documentations

    Some projects have API documentations where you can find the new releases. For eg: Qoauth library has api docs for each release.

    3. GitHub

    Projects which use GitHub display their releases in the releases page of GitHub project. For eg: Injeqt library has all the releases shown at its releases page.

    4. GitLab

    There are projects which use GitLab. For eg: You can find the latest version of Qdatacube library on its GitLab Project page. Other than that, GitLab 8.2 now supports releases as in GitHub.

    5. SourceForge

    There are some projects on SourceForge that have a releases page. Some have patches. You could easily find the latest stable release there. For eg: QScintilla library has its latest release indicated in the title of its documentation page at SourceForge.

    6. Bitbucket

    There are several projects on Bitbucket as well. You could find the latest stable release in Tagssection at Overview page. For eg: qjsonrpc library has its releases defined under different tags at its Overview page.

    7. Forums

    There are some projects that announce their releases on different types of forums like Google group, Qt forum or any kind of project specific forums. For eg: ff7tk announces its releases onQhimm.com Forums.

    Links to the above sources of a specific Qt library can be found at the relevant web page of the library in Inqlude. Otherwise you can find a JSON file available at http://inqlude.org/inqlude-all.json, where you can find all the links to above sources of Qt libraries.

    Once you find a new release of a Qt library, you are always welcome to contribute a new patch of the manifest file for inqlude-data library archive.

    Community Bonding Period




    Week 1

    The community bonding period for GSoC 2016 is from 23rd April - 23rd May. It runs throughout one month period. So I am now in the community bonding period. This is a good time to get prepared for the coding and to get deeper involved in the community. This also is a good time to start to contribute. 

    During the first week of the community bonding period, I followed the instructions given by google and did the non technical tasks including submission of tax forms and registration for a payoneer account.

    I also created a developer account in KDE, added Cornelius Schumacher as the mentor and uploaded the requested ssh keys. 

    In the meantime, I cloned the Inqlude repositories and installed Ruby, Rubygems and Inqlude executable. Since I formatted my machine, I had to do all these things again to get ready with the project. I also ran the process to generate html views locally in my machine. In these ways, I set up the development environment for the project.

    I also started creating my upcoming To-do list in todoist.com as this would be useful for me to keep track of things to do and remind me of their dead lines. I also asked my mentor if I need to use any special IDE for coding. I prefer using Sublime Text. He asked me to use whatever works best for me. Since he uses Kate or Atom for most of the coding, I installed them as well.

    Week 2

    I came up with an issue while modifying and viewing the modified html views of the web pages. While executing the project locally, I could generate the html views locally using 'inqlude view'. But I could not see the modified pages after doing the modifications. For instance, I changed a sentence in about.html.haml file and then used the 'inqlude view' command to generate the html views again. But that gave me the same page as before. So I assumed that I have gone wrong somewhere. I felt doubtful of the process that I carried out to modify the pages locally. 

    After doing some research, I found the cause for this issue. What I did previously was modifying the html.haml pages in view directory of the inqlude project and then tried to view changes in html files. But I noticed that 'inqlude view --output-dir=OUTPUT_DIR' command uses html.haml files in view directory at '/var/lib/gems/1.9.1/gems/inqlude-0.7.4/view' location. When I did local changes to the files in that location and executed the 'inqlude view' command, I got the html views of modified page successfully. Then I wanted to know how I should commit and push any local change to the main repository. Should I copy those files in '/var/lib/gems/1.9.1/gems/inqlude-0.7.4/view' location to the view directory of the inqlude repo that I cloned and commit changes from my project location? So I sent a mail to the mentor to clarify my doubts. He explained me the underlying process and advised me to look into the code. 

    The inqlude command takes the templates from a directory relative to where the `inqlude` executable is located. So if I call the local executable from my checkout it will use the local templates. So I changed the view.rb file inside inqlude executable to take the html.haml files from the view directory of my project location to generate html views. In this way, I resolved the first issue that I came across in the project.

    I also played a little with the Inqlude codebase. I manipulated the html files to see how the basic html changes reflect on the final preview. 

    Week 3

    Community bonding period is also a good time to start to contribute. An easy way to contribute Inqlude is looking at existing libraries and checking if there are new versions, and if there are submit pull requests for updated manifests. So I started preparing my first pull request.  My mentor asked me to create pull requests for updating the libraries. He suggested me to start with one, so I can get used to the work flow and the tools.

    I went through the project sources and home pages of most of the Qt libraries at Inqlude to check for their new releases and updates on meta data about those libraries. I found updates in meta data of lots of existing libraries at Inqlude. 

    I searched all the unreleased libraries through their respective homepages and sources to find if they have latest versions. While doing that, I found the following new versions.

    adctl0.1.1
    kdreports1.7.0
    mimetypes-qt41.0.1
    qdatacube3.1.2
    qjsonrpc1.1.0
    qserialdevice0.4.0
    qtav1.8.0
    qtftp5.0.0
    qthttp5.0.0
    qtrest0.1.0
    qtrpt1.5.5
    qtWebSockets5.6.0

    Actually some of them are latest releases. One library adds new platform support with its new release as well. I started creating my first pull request for Qtav qt library. I sent a pull request for updating the manifest of 'qtav' library in inqlude-data repository. Inqlude only had the generic manifest file for this library and I added three release manifest files for 1.8.0, 1.9.0 and 1.10.0 releases. Shown below is the manifest file that I created for 1.8.0 release.

    {
      "$schema": "http://inqlude.org/schema/release-manifest-v1#",
      "name": "qtav",
      "release_date": "2015-09-01",
      "version": "1.8.0",
      "summary": "A cross-platform multimedia playback framework based on Qt and FFmpeg.",
      "urls": {
        "homepage": "http://www.qtav.org",
        "vcs": "https://github.com/wang-bin/QtAV",
        "download": "http://www.qtav.org/install.html",
        "announcement": "http://www.qtav.org/blog/1.8.0.html",
        "custom": {
            "Wiki": "https://github.com/wang-bin/QtAV/wiki/_pages"
        }
      },
      "licenses": [
        "LGPLV2.1+"
      ],
      "description": "QtAV is a multimedia playback library based on Qt and FFmpeg. It can help you to write a player with less effort than ever before.",
      "authors": [
        "Bin Wang <wbsecg1@gmail.com>"
      ],
      "maturity": "stable",
      "platforms": [
        "Windows","Linux","OS X","Android","iOS"
      ],
      "packages": {
        "source": "https://github.com/wang-bin/QtAV/archive/v1.8.0.tar.gz"
      }
    }

    While doing this task, my pull request failed due to a syntax error. Actually I had missed a comma in
    the list of urls. So I learnt about Travis CI tesing as well. I corrected the syntax error and committed the changes along with manifest files for 1.9.0 and 1.10.0 releases. 

    I had no idea on how Travis CI does building and testing software projects hosted at GitHub. So I studied about it and did some exercises to experience that workflow. You can find it at https://github.com/nanduni-nin/travis-broken-example. This made me understand how Travis CI works in inqlude-data project.
    Meanwhile, I started writing a wiki about 'Finding new releases'. This was an interesting task. In this wiki page, I could describe the process I followed to find new releases of Qt libraries. I believe that this would be a motivation for all Qt application developers and Qt library developers to contribute Inqlude.

    My mentor pointed out me a nice article on 'How to Write a Git Commit Message'' . That was very interesting. I learnt lots of things from that. 

    Also, I did know only same basics of using git commands. So, I learnt to use 'git rebase' and I went through several docs to learn what that really does. So I merged all my previous commits into one and added a combined commit with title 'Add 1.8.0, 1.9.0 and 1.10.0 releases of qtav' along with a small description. 

    I also did some layout and template edits to this blog to make it more simple and easy to navigate.

    Week 4

    During this week, I spent most of the time familiarizing myself with inqlude website and inqlude repository. I tried to understand how different pages are managed using inqlude command line client for Qt library archive.

    I went through the inqlude code base and figured out how inqlude commands work. For eg: I tried to understand how 'inqlude view' and 'inqlude verify' works. 'inqlude view' command is useful to create a website in a specified directory from manifest files. 'inqlude verify' command is useful to verify a manifest file to look for proper syntax and other specific rules in manifest specification.

    Meanwhile I tried to create and test a new page within the inqlude website. To get some idea, I created a web page for latest releases and tried to practice ruby syntax and haml templates.

    I also tried to solve issue #19 on 'Align summaries on development page vertically'. For this, I had to do some minor changes in development.html.haml and few modifications on inqlude.css.

    After all, I did not forget to update some new releases for qt libraries in inqlude-data archive. I added a new manifest file for qscintilla, which is a Qt port of Scintilla C++ editor control. I added its latest release 2.9.2. Shoen below is the corresponding commit message. I got this commit successfully merged into the inqlude-data repo. 

    Add 2.9.2 release of qscintilla

    Add version and release date.
    Add link to the release announcement page.
    Improve description.
    Add platform support for 'OS X', 'Android' and 'iOS'.
    Add source package for 2.9.2 release.


    After having the wiki I wrote on 'Finding new releases' reviewed by the mentor, I added that to the inqlude-data repo after doing the proposed changes. For each way of finding a new release, I added an example library for the reader to get that idea properly.


    Got selected to GSoC 2016 with KDE-Inqlude


    I am very excited and happy to get to know that I have been selected for GSoC 2016 with Inqlude - KDE. First of all, let me offer loads of thanks to KDE for selecting me as a GSoC student of their organization. I am extremely happy to go ahead with Inqlude for GSoC 2016. It is indeed a lifetime achievement for me.

    I would also like to thank Mr. Cornelius Schumacher for the massive support that he gave me to drive towards this achievement. Thank you for all your advises and keeping me on right track since day one. I am indeed privileged to have had you as my mentor and I always find you as an exemplary character in my life.

    I will do my best to make this project a successful and useful one for the KDE organization and all its users. I plan to maintain this blog through out the project period to update my progress on the project.

    So, I would like to welcome all of you to the blog I created to reflect my contributions towards the project on improving Inqlude Website. This blog will be updated each week with a moderate description about the progress done during the past week. The updates could also include the challenges faced, solutions tried and the solutions found for the challenges during the respective week.

    Other than the progress reports, I would publish posts about other interesting stuff related to the project. For example, I might write a wiki on guiding users to contribute Inqlude which is a potential option for the proposed project.

    All of you are welcome to read and share your thoughts with me regarding anything related.

    Note: Here is the link to my project proposal that brought be this wonderful opportunity.

    Cheers!!!

    Analysing Inqlude Website


    Today, I carried an analysis of the current Inqlude website. Then I came up with a set of suggestions to improve functionalities of the website. I was basically focusing on rendering a better user experience.

    Here are the problems and suggestions that I noted.

    1. Add a filter box such that when we type a letter or a piece of text, libraries starting with that piece of text are filtered. I came up with this suggestion as a solution to minimize scrolling. I believe that users including myself prefer minimal scroll. This would come in handy when we use this website with mobile devices. 

    2. Add a small drop down pointer at the end of that filter box to search libraries by different options such as version, platform, licence etc. The user can tick the desired option and select the corresponding libraries. Otherwise, it would also be better to keep separate drop down boxes to different options like platform and licence so that we can provide user the facility to select(tick) a platform or a licence or both if required and then select that relevant platform or licence. This is the intended task given in the GSoC idea description. 

    3. Add responsive layout. The current website is lack of a good responsiveness when it comes to small scale devices such as mobiles. In order to make responsive layouts, I thought of using media queries.

    4. On the development versions page, the summaries of the libraries are only vertically aligned within each section, but not across sections. This should be fixed to make the page look more balanced. This is issue #19 which I found from the inqlude github issues list. I would like to resolve this issue during my project.

    5. I feel that it is sometimes difficult to identify the particular summary description for the library although they are horizontally aligned in the table. I would like to propose two colors ( one row in white back ground / next row background in little darker than pure white) for adjacent rows. This will make the user easy to go through different rows. 

    6. Remove the close button near search button on top of the website or else add some functionality to it. I realized that it does nothing currently.

    7. Show latest releases on web page. It would be nice to have a section with latest releases on the web page, so user know which libraries have been recently updated. This is issue #22 which I found from the inqlude github issues list. I would like to resolve this issue during my project. I thought of adding latest releases as a separate page similar to 'stable releases'.

    8. Apply justify alignments for the content in pages 'How to contribute' and 'About'.

    9. Add a search box so that when user add some key words from summary of each library in manifest file, the search results will show the relevant libraries along with their summary text. I wanted to suggest this as there is no option in the current site to find libraries if the user does not know the name of the library exactly.
    eg: User wants to find a a library that provides integration of QML and KDE Frameworks. So user can type 'QML' in the search box and search results will display the library name 'kdeclarative' and summary if needed. 

    I am not sure if the search box at the top of the web site is designed with this intention. Currently, this search box does a google search. 

    10. Search button near the google search box does not match with the existing web layout. Its color, size and orientation should be modified.

    11. Look and feel of the website is okay. It would be nice if we can use a different color for the top ribbon of the website (not a completely different color, but not pure white). This is because that I felt difficult in distinguishing the title of the website with its content. 

    12. Lack of consistency thorough the site. When we move to sections : 'development versions', 'unreleased', 'commercial' and 'all', the description text of the website that appear with 'Stable libraries' section disappears. I feel it as a bad UI design. It is good to keep that description in all those aforementioned pages.

    13. At the top ribbon of the website, the links to 'About', 'How to contribute', 'How to find libraries' seem unnoticed and rarely being used by the users. We need to make those tags/links look more attractive and noticeable.

    14. Add some title to the table of libraries. For eg: Library name and description. This is because that I myself felt difficult to understand what these two columns are about.

    15. Add some small description of the library to appear on hover over the library name. This is because that most modern websites(eg: facebook) follow less navigation across pages which many users prefer.

    16. This is an additional suggestion. Why don't we add the link to mailing list in the page of the library?

    17. Add some quality indication. This is issue #17 in Inqlude github issues list. It would be nice to have some indication on the web site, which shows this quality depending on certain criteria.

    18. Integration tests for web site. To make sure that the web site doesn't break, we should have integration tests which check that the generates pages for the web site meet the required expectations. More details are included in issue#28. Integration tests should cover generation of proper HTML, checking for navigations, checking for display of library details, checking that data consumed by programs is correct, such as the JSON for all libraries, checking that the search is generated correctly and works and checking that the comments are generated correctly and work.

    I believe that aforementioned problems and solutions would be very useful during the implementation of this project. 



    Using Inqlude Command Line Tool


    Inqlude command line tool is a basic component of Inqlude project. Inqlude comes as a Ruby gem. It can be easily installed and it provides a command line interface to handle Qt libraries in a similar way as Ruby gems. There are commands to install libraries, list available libraries and installed libraries, and more. They are as follows.

    1. Create new or updated manifest
      inqlude create <manifest_name> [version] [release_date]        
    2. Create manifests from git checkout of KDE frameworks module
      inqlude create_kde_frameworks <frameworks-git-checkout> <output_dir> 

    3. Download source code archive
      inqlude download                                                      
    4. Information about how to get involved
      inqlude get_involved                                                  
    5. Describe available commands or one specific command
      inqlude help [COMMAND] 
         
    6.  Install library                                         
      inqlude install  
          
    7. List libraries                                               
      inqlude list                                                          
    8. Create release manifests for KDE frameworks release
      inqlude release_kde_frameworks <release_date> <version>               
    9. Review pull requests on GitHub. Use 'username:branch' as repo parameter
      inqlude review <repo>                                                 
    10. Show library details
      inqlude show <library_name>                                           
    11. Scan system for installed Qt libraries and create manifests
      inqlude system_scan    

    12. Uninstall library                                              
      inqlude uninstall                                                     
    13. Verify all manifests or specific file if filename is given
      inqlude verify [filename]                                             
    14. Create view
      inqlude view -o, --output-dir=OUTPUT_DIR                              
    Libraries are described by manifest files, which are maintained in a separate git repository. Inqlude integrates with this git repository and uses it as the list of available gems. This repository can be found at https://github.com/cornelius/inqlude-data.

    There are 3 basic ways to get Qt libraries. 

    1. Using the web site at https://inqlude.org. There you can find the information about available libraries, and then you can get the libraries using the provided links. This is the recommended way for now.


    2. Using the command line client from package. This client makes it easy to get the libraries you need with just a few commands, without having to know URLs, or how libraries are packaged. There are 2 ways to get the command line client. They are as follows.
             - Download its sources from download.kde.org. Link is here.
             - Otherwise, clone the repository. Use command line command as follows.

    nanduni@nanduni-TECRA-M11:~/myproject$ gem install inqlude
    

    3. Using the command line client written in Ruby

    This can also download libraries. But this is mostly aimed at maintaining the inqlude data. This is available as a Ruby gem. 
    See if you have rubygems installed in your machine. If so, you can simply use the following command to install inqlude. Otherwise see rubygems.org to get Rubygems. 
    nanduni@nanduni-TECRA-M11:~/myproject$ gem install inqlude
    
    Now that you have command line client set, you can use inqlude commands to get libraries. To get the set of available libraries, use the following command. 
    nanduni@nanduni-TECRA-M11:~/myproject$ inqlude list -r
    

    You can easily install a library with following command.
    nanduni@nanduni-TECRA-M11:~/myproject$ inqlude install <library_name>
    

    You are able to view the set of installed libraries using this command.
    nanduni@nanduni-TECRA-M11:~/myproject$ inqlude list
    

    This is how I experimented the functionality of Inqlude command line client.

    References