navarjun

navarjun

07 Jun 2017

Story of swords of middle-earth

This project was done as a one week assignment for a Information Design History class taught by Paul Kahn at Northeastern University in Fall of 2016. The requirement of the project was to design a genealogy of _something_—the choice was left up to the students. Some students did their projects on their own families, some picked up their favorite books, a student did her project on evolution of dogs. Doing and discussing these projects we got to learn more about how the same problem of representing genealogy could be approached in different ways, and all representations have their own pros and cons.
One of my classmates, Andrew Tang who had taken gone through this class last semester, had created the genealogy of important people in Game of Thrones. I had always been into Tolkien universe, and co-incidentally I was reading Lord of the Rings(LOTR) those days. The choice was obvious, I picked LOTR as the topic for my assignment. As I searched the web for good data source, I realized that a lot of genealogy diagrams of LOTR already exist. So I decided to add a little twist to mine: instead of people being the main characters in my visualization, swords would take the front stage. Soon I realized that I have signed up for a difficult data collection project. The LOTR Wiki helped a lot. But I still had to go through a lot of pages of reading and writing everything down.

First drafts


My hand sketches while collecting data and understanding data

I started drawing the ways I could visualize the data I collected over 4 hours. Drawing map of Middle Earth was my initial instinct, as a lot of other visualizations about LOTR are based on maps but instead of focusing on the swords it was focusing more on geography and events that happened. The story of the swords would only be visible if I drew a timeline with events as part of it. When we read text, we read a random sequence of events and our brain arranges them in a particular order effortlessly to make the story apparent. I had to do something similar visually. This approach made me decide that geographical information was not as important as people involved with swords, as most people don’t remember the map of Middle Earth. Including geographical information would only add another layer of data that people would have to discover in the poster, distracting from the actual stories of Swords.

Going digital


I put together a poster within 4 hours that was doing a good job of telling the stories but it wasn’t good enough. I hadn’t worked on icons at all, they were very rough. Some parts were really crowded. Deadline was close so I took it to our studio space, where all grad students work, for feedback. The version of the visualization that I turned-in for the class is following.

I continued to work on this even after turning it in for the class. It kept improving with every iteration. The typefaces changed, icons got upgrades, colors became more consistent, lines became much less distracting and so on…

Acknowledgements

I would like to acknowledge Andrew Tang, Lia Petronio, Xingyue Li and Mahima Pushkarna without whose critique it wasn’t possible. And most of all Douglass Scott, who encouraged me to take it to next level. Thank you guys!

High resolution pdf

If you are interested in getting a printed copy, I would love to ship it to you. Please visit the shop or connect on Twitter (@Navarjun) or email (navarjun.singh@gmail.com)

03 May 2017

Sundarbans | Brand Design

Sundarbans is a forest in the western coastal region of Bangladesh in Bay of Bengal. It was declared UNESCO World Heritage Site in 1997. This project was done as a brand design exercise for Sundarbans and for the graphic design class at Northeastern University. The studio class was designed to touch on many aspects of graphic design including but not limited to illustration, typography, colour theory, commercial constraints etc.

The deliverables for this class are listed:

  • Brand identity: includes logo, logotype, colour palette, typefaces and fifth element
  • Business card: for the people working for Sundarbans
  • Business letter format: for formal communication, includes letterhead
  • Business letter envelope: for mailing formal letters
  • Information sheet: a pamphlet that serves as introduction to the Sundarbans
  • A set of 3 commercials: for the Newyorker magazine
  • Site sign: A sculpture design with introduction to the place in multiple languages
  • Booklet: with details of the UNESCO World Heritage programme and the Sundarbans.

Logotype

Logotype was designed with extensive drawing of all the ideas that happened in my brain or collected from inspirations and helpful constructive critique by my classmates. Bengal tigers are the native species on the Sundarbans. Although there are other species of birds, fish and fresh water dolphins that live only in the Sundarbans, I picked Bengal tiger since it is also part of many traditions carried out in Sundarban tribes.

A curvacious but simple typeface was chosen to go along with the illustration of tiger in order to emphasise the illustration and include the organicity of forests in the logotype.

Colour palette


The base colour palette chosen for the brand was based on the features of the Sundarbans itself. The colours are not directly picked from the Sundarbans forest as it’s a extensive forest, the biggest mangrove forest in the world, but the colours are representations of the forest’s features.

Fifth element


The fifth element is an element in brand design that can be used to represent presence of a particular brand in the absence of a logo. It could be a pattern like Sephora’s white and black stripes. Sundarbans is a forest with great variety of flora and fauna. The fifth element tries to capture the essence of that. In fact a lot of my initial drawings for a logo were of birds found in Sundarbans, but because it’s hard to draw a particular species of sparrow distinctively I chose a tiger but a bird and a branch worked perfectly as a fifth element.

The designs for booklet, sculpture, information sheet are in this dropbox folder for you to explore. Thanks for reading about my project.

08 Mar 2017

Hubway bike exploration

Screenshot of the project website

Project Link

This project tries to explore the Hubway bike sharing system’s dataset from the bike’s perspective. It explores one bike’s trips around Greater Boston Area at once. This was decided as there’s a tendency to start seeing the general viewpoint of the Hubway system as a whole. However, I wanted to focus on bike’s journey, as if bike was a person :). Every time you go to the website, it loads only one bike’s data, which is randomly selected from the list of bikes that were used in 2016.

I started this project as I wanted to participate in Hubway data challenge 2017. But I fell sick just 3 days before the deadline and hence was unable to finish it. That’s ok! I still finished it. This time I would not write too much, I would just leave you to explore the project. Let me know if you enjoy the project by tweeting @Navarjun.

Project Link

The project code is available on github.

Bonus (if you are still reading)
If you find an interesting bike that you would like to share with your friends (I hope to be one of them), you can click the “share” button on the website, it would generate a link that would always lead to the website with the same bike’s data.

23 Dec 2016

Christmas stickers

Try the app here.

A young man is enjoying a day of nothing to do, having some pain in his eyes after the fall semester. It’s winter, season’s first snowfall is awaited. In New England, people are waiting for Christmas. But this young man, has no awareness of it. Not only because his family isn’t Christian. But also because while the Christmas decorations were going up around Boston, he was busy with the end of semester obligations.

After procrastinating on a stroll in the open clean air of north Atlantic, for a long month, of final submissions at his grad school, he is ready to give himself a break. A break where he holds a cup of hot apple cider, of fresh apples from farms of the north-east, and walks around the city; starting next to Charles river. Looking at bare trees and fallen leaves, waiting for snow to cover them. Watching fat squirrels, layered up under their skin for Winter. The students, who are bustling in these parts of the city, aren’t there as vacation time is here.

He walks, no earphones, no camera, just enjoying the day of nothing to do while his eyes, neck, and shoulders recover from the fatigue. Often saying ‘hi’ or smiling to the people who still happen to be on streets, layered up. One thing he didn’t notice is the Christmas decorations. It’s only after dusk, that they become his centre of observation as they start glowing against the darkness rising behind them. They are beautiful, he thinks. People start showing up on the streets at this hour. Humans, he wonders, everywhere find something to celebrate.

The next day, he starts drawing some of the Christmas decorations that he can recall from his memory. Eventually, ends up drawing a pixel art Christmas tree. Then on, translating those random scribbles into digital illustrations, creating an iMessage app.

Try the app here.

18 Dec 2016

Romania | Infographic


This project was part of a class taught by Douglass Scott in fall 2016. Each student was assigned a country, for me it was Romania. And we had to create an infographic poster that would make us all learn more about information design. Doug would ask for drafts each week, and he (along with all students) would provide constructive feedback on the posters. The feedback was used to refine/modify the poster for next week. It was left totally up to the student about what feedback to ask for and consider for next iteration.

Data and First Draft

I started with looking at the data we had to include into the infographic and started categorizing data and figuring out which categories could go together. When it came to deciding the size of the poster, I decided to go with the standard poster size that I generally use 22x34 inches because of the plotter printer specifications in our university (it cannot be more than 36 inches on any side). I decided I would modify it as I need later on, since I didn’t start with all the graphics ready. The color palette came from the flag of Romania.The European map comes into the west, so I decided to keep it on the right side of the poster so it looks like it’s coming into the poster from right. However, if the continent was Africa or Australia, they have a perfect shape which can be placed anywhere on the paper.

Getting into Comparison

I wanted to look at how Romania compares with other countries that we were supposed to have in the graphic. So I created this exploratory poster that was almost as tall as me (actually taller by a couple inches).

This iteration gave me a better idea about what I wanted to include in my final poster. Some of the iso-types I used also needed some refining. So yes, the next phase started.## Taking the newspaper metaphor (seriously)One of the other students in the class had this idea of creating a newspaper for his country—Taiwan. I felt like newspapers have a lot of detail in them, and I had already put together a infographic that had a lot of detail with rankings of different countries in the world. So, I decided to create a newspaper like poster. I have to agree that I took it a little too far.

This poster was super full “like a newspaper”. There was no breathing room. Probably as a newspaper it would have made a lot more sense. But for a infographic, which people would look at, it was a bit overwhelming.## Final StepsThe previous iteration gave me a starting point for the final one. And I added some breathing room to make a better composition and muted the cyan a little bit. One more thing I observed in previous iteration was I needed to change the sans-serif typeface I was using for subheads and numbers—Gill Sans. Gill Sans is good as far as text is concerned but when it comes to numbers, the letter-spacing is not great. Number ‘1’ has a lot of space before it as compared to other numbers. So I started looking for a typeface that has a base for 1-glyph. Museo sans had that, and it paired well with the existing Adobe Caslon which I was using for title (heavier) and headings (italic). Finally, I was able to create something I am proud of.

[High resolution pdf](https://s3.us-east-2.amazonaws.com/navarjun.com/Images/romania-data/CountryData_it11-un.pdf)

17 Dec 2016

It's time

This project was part of a class taught by Douglass Scott in Fall 2016. The assignment was to record a week of our own ‘media usage’ (or digital device usage) and try to visualize it in a poster or accordion form, so as viewers can look at it and understand the data behind the infographic. The amount of detail students wanted to add into their work was left totally up to the student.
However before creating any infographic, we had to collect the data. And these days there’s literally an app for everything. Some students used one or more of them to record their digital life. I couldn’t find anyone that could solve my purpose for the details of the usage I wanted to record. I wanted to record all the variables like app I am using, on what device am I using the app and did the work I did pay me financially or not, was it school homework, any parallel app usages, etc. I had no visualization in mind, which is the way I work.

I never have a goal where I try to reach, I always try to figure out what is the best goal to reach before actually going there.

First Draft

But since the data wasn’t ready I had to come up with some drafts that could express my data. Doug, at the beginning of the project, mentioned that it would be really hard to do this project without using colors. I took that sentence as a challenge for myself and decided to give one color infographic a shot. Following image shows what it looked like.

It was a heptagon form that folded into a little triangle, it could work as a desk top infographic by folding it into a triangular or square pyramid. I chose a heptagon form considering that there are 7 days in a week and they are cyclic — Monday to Sunday and then again Monday to Sunday. Although it was a very particular week, but most of my weeks look the same (I guess that makes me a boring person :P).

Collecting data and next steps


Believe it or not, collecting data was the most difficult part of the whole project. I am not used to writing everything I do, but somehow that week I was aware. It was challenging. At the same time, I would not say I was stopping myself from using more media while recording as happened with other classmates. Nevertheless, it was an enlightening experience.
After collecting the data I was literally overwhelmed by the amount of information I had to display on to a piece of paper. And I realized why Doug had mentioned that avoiding colors would be really hard. I started categorizing the data into different categories, which could fit themselves into the form I had already decided before looking at the data (it was definitely a bad idea to keep using that form). I failed!
After a few hours of paying my head and some sketch paper, I realized that I have to use colors and definitely change the form. Then started about a couple hours of paper folding process. Watching some origami videos and another decision — since I was changing the form, it made sense to include more detail of the data. It was the birth of zoomable poster (one of my friends gave it that name).

This form made the viewer look at the overview of the week and as they folded it out they could see more in detail about what times of the day did I use what kind of media. Folding out the paper to the third level would let the viewer see all the 24 hours in a day (from 6am to 6am next day). It was a time consuming task to translate all the data into Illustrator using graph tool within illustrator itself. Following image shows what it looked like:
Zoomable poster

Final problems and solution

The problem with zoomable poster infographic was that the folding out to second level would give the viewer some bar-charts that were all the same scale. But folding out to third level gave thinner bars that were not the same scale as the second level bars. Making second level bars the same scale as the third level bars, made them so small that it was hard to see at second zoom level. However, colors were working great! (except I had to reduce the amount of red in the pink to make it really distinct).
It was a hard decision to take, but I decided to remove the amount of detail in my current poster. I definitely got influenced by Fathom’s Miles Davis visualization since I visited their office and they talked about it. They had managed to avoid using a lot of colors but they were able to show detailed information using interaction. The next iteration of this project led me to remove a lot of detail (as it wasn’t interactive) and was a total re-direction of the project.

The triangles on the sides were just aesthetically decided to be triangles. But my data-viz nerd friends were reading triangles like the base meant something and the height meant something else. So I had to go back to bars, and with suggestion of some of those data-viz friends I added some notes and little details in the visualization. Following is the final version, and I am quite satisfied with the result.

It looks great in print (17x17 inches poster). If anyone wants it, please tweet at me @Navarjun, I can send you a printed version. :)

15 Dec 2016

A little about my travels

This project was done as part of a class taught by Douglass Scott at Northeastern University in fall 2016. The students were asked to design an infographic (poster or accordion) that visualizes trips from the place they currently live in. The first trip was the one that all students did everyday — from current place of residence to the Ryder Hall, which is where the class happened. The second trip was to somewhere that we have visited within the United States. The third trip was to somewhere outside the United States. We needed to tell 10 things about each trip in the infographic.
For my second trip, I imagined a trip that I would make from my current home to my home in India. For my third trip, I decided to visualize my visit to my cousin in San Jose California. I started sketching with pencil in accordion and poster form. Later decided to go with accordion form because a trip is a map and maps for going places are portable.

First drafts

Poster form

One point on the bottom-left of the paper is used as a starting point, current home, for all the 3 trips. The distance of each trip was abstracted in order to take advantage of the paper, since walking to Ryder Hall takes 15 minutes and flying to India takes 24 hours optimistically. Each trip has a different colored line which the viewer can follow to know more about the trip.
The lines go together as long as the route for the trips is the same and split when the route diverges. For example, at Boston Airport the green line continues to Houston Airport while the purple line goes in the other direction. The whole map uses a legend at the bottom-right to reference the mode of transportation in each part of the trip.

Accordion form

The format is used in a way that each spread has one trip on it including origin and destination of the trip. Color of lines is used to differentiate between the mode of transport (foot, car, train, airplane) and what I was doing while traveling. The purple line represents my actions during the trip and blue ones represents the mode of transportation. Along with color different kinds of lines are being used to encode information.

But again, this form also uses a key (legend) to help the viewer understand the map better. According to our professor, keys are a crime in most cases. His opinion is that you never need a key unless you have an overwhelming amount of information to represent.

If they have a key, it means they didn’t do it correctly. Information should be right where the viewer is reading and they shouldn’t have to look it up somewhere else on the paper unless it’s absolutely neccessary.
~ Douglass Scott

Further Drafts

For the next iteration I definitely had to remove keys, his reason makes sense. I started drawing it in illustrator and improved upon some of the things, worked on my icons. I added the information close to the lines. But different kinds of lines were getting too confusing so I had to find some other way to represent that information. Some typographic mistakes also became apparent when I printed things out on a letter sized spread. But according to the feedback everyone suggested that the size was too small.
With the feedback I decided to increase the size to the tabloid size spread. But as soon as I did that I was unhappy with the portability of the project. It wasn’t as portable as I initially imagined it to be. Then I tried to rethink the accordion form. After a bunch of sketches, I decided to use each page of the accordion as one step of the journey with additional information. Each page was square that folded behind the title page, each trip would start from the title page and open-up in different directions. The folded accordion was sized 10x10 cm.

The problem with this format was that the opened up accordion would be really long, and was not practical to print with available resources. Doug suggested me to decreased the size to 5x5 cm. But I went back to sketchbook. I decided to use the hexagonal-shaped accordion which gave me more space to add information on the paper rather than just one step on one sheet.

13 Mar 2016

A Question

There is always more to life,
The more we try,
The more it hides.

The better the color,
The better the price.
The more one pays,
The more one cries.

Sometimes I think,
Is it wise?
Sometimes about,
What is wise?

Where to go?
Or where to hide?
Rule the world,
Or simple life?

12 May 2015

Should I?

I have started writing this, and about 10 times erased it and restarted it. That’s exactly what I am going through these days. A lot of confusion. Living alone has it’s own charm, gives you a lot of time to think, get in touch with lost friends. Having done that, you still have time left.

I don’t know about others but I start to think a lot about life, especially while reading biographies and memoirs. The idea of life makes me think a lot. What do to make it good. Universe is so large that even after 13.8 billion years after it’s origin, only a part of it is observable - which just means that distance that light travels in 13.8 billion years is not as long as the universe is vast. Are we even significant. People live their lives changing lives of other people - for good to for bad. But should it be all about us? Or should it be all about others?

We remember who influence our life directly or indirectly, be it Osama Bin Laden or Mother Teresa. But for how long would we remember them. Everything dies eventually, even memories, probably books won’t.

Problem with me though is all about me and all about others seem to be the same. I try to help people not because they need help and it will make them feel better about it. But because, I will feel good about helping them; which makes me selfish I guess. So, I live both of the questions simultaneously.

Then they say intent matters. What about terrorists who killed Charlie Hebdo Cartoonists, they thought their intent was good - they were freeing world from a few more anti-islamists(I know I should not say that, they were just cartoonists.. but here it is referenced to what terrorists thought). So, what now?

There are a lot of questions like these which we probably will never understand, or answers would vary person to person. Why would I not want to have my own beliefs though is because I haven’t settled on one yet. Should I?

28 Sep 2014

Aspirations and careers

Past few weeks have been a roller coaster ride for me. I just left the job in July, I thought of starting up my own venture as soon as I am back from my 1 week travel plans. But then, those travel plans extended to about a month. And without a doubt I enjoyed them a lot, it was fun and I have no regrets for that. I was happy, about to pick up my gear and set myself up in a serene place away from the disturbances and coziness of home and start-up.

But as soon as I started talking about leaving the house for something like my own start-up(which I had already done once when I went to Bangalore), my mother started to fear for I was weak(as per her standards) and should stay at home for recovering my health. So, after trying to convince them, I learned that I would always fail. I stopped saying to go out(rarely though I mentioned that I wanted to go out). I just asked for a few things that would make it possible for me to work from home itself(which by-the-way is in a very small town).

After a few days though, my parents started again convincing me to go for further studies, as they really want me to get a Master Degree. I left the job to start my own venture, after me and my parents decided not to go for further studies. But a few weeks later I was back to square one. So, I didn’t want to go for further studies and I didn’t want to go abroad. But parents are parents you know. They worry a lot, they want me to be the best in whatever I do, they want me to avail all the opportunities that are not available here in India.

They really wish the best for me, so they always look for the safest path for me to travel and advise me to take that. They have always supported me in every way and I know they always will. I want them to be like a parachute, which saves us from hitting the ground badly in case we fall from the plane. Anyways, they are being the pilot of the plane, so I agreed to go for further studies and abroad.

But then came up another issue, according to which I didn’t want to study engineering further because I think I already can engineer stuff pretty well. So, I demanded to go for design(Interaction Design), but that too became the hot topic among our discussions, turning them into debates. According to them, art students study design(and arts is not a reputed area of study in India. Yes, in a country full of art, it’s not). I think that making great products has to be design and development. Being an computer engineer I can develop digital products really well, but designing got my mind tangled. I want to remove those tangles.

Anyways, I know parents will support me for anything I do. Today, they finally gave up on convincing to go for Master degree in Engineering, although half-heartedly. I know they love me and they want me to be successful.

So, I was discussing all this with one of my good friends. She asked me to clear up my confusions by talking to someone who understands me. Well, my blog understands me pretty well, I guess. So, here I am writing all my feelings that clears my mind. And when my mother reads this, she is going to kill me(because my parents have never actually stopped me from doing anything, always been very supportive, but it’s just the lack of awareness that makes them think that entrepreneurship/design won’t work. so they are worried).

I just wanna say, I’ll make you proud one day. Don’t worry. I may not know what’s best for me, but I will soon. That’s life isn’t it.
~Your son.

< previous
page 2 of 3
next >