Android, Java, Linux, UX/UI

QRite – QR Code Generator

UPDATE: Tanushri recently won a LG G Watch watch in PyCon 2015 (thanks to Google), so we have a watch to start implementing the smartwatch feature. The app will now be free on Google Play as well, as we don’t need money anymore 🙂

I had recently bought a smart-watch (SmartQ Z) and as mentioned in some of my previous posts, I started playing around and creating my own watch-faces. One fine day, I got an idea to put my contact details on the watch screen as a widget showing a QR code (with my vCard encoded) so that if someone asks me for my details, I could just flash my wrist and they could scan and save my contact info. Geek lvl over 9999.

So, I spent some a few evenings with a friend, re-inventing the wheel and created first my QR Code generation app. It was mostly an Android revision for us with some UX/UI brainstorming done now and then. The goal was to make it simple. Very simple. And clean. With just the necessary customizations given to the user. This is how it looks till now:

screenshots

You can check out the beta attempt, get some more details and screenshots here : http://qrite.suchakra.in/ Its an open source app and if you want to use it or want to contribute to the source code, head over to this Github repo. The source is not so rosy and glorious considering I just focused on functionality and gave exactly 0 about anything else :/ It needs some cleanup for sure and it is indeed the next step.

So there are some features already available as configuring color, size and recent contact details for which QR code was generated. And some features are to be added, such as digitizing an already available QR code using your camera and ‘scanning’. The major feature, “Send to Smartwatch” is also left. The plans are to support Android Wear, Pebble and generic android (such as SmartQ Z) platforms. However, I don’t have Android Wear/Pebble for which this could be most useful. If you want to donate a Android Wear or Pebble (if you have one extra) or some money for me to get those, or if you just want to support open source development, you can consider buying the app from this Play Store link (it will be made free as soon as all features are completed). You can also send a donation by clicking 

Just FYI, my goal is approx USD $130 (price of cheapest LG W100 watch). Feedback and suggestions for the app are welcome.

TL;DR – Just another QR code generation app. Open sourced. Smartwatch integration in progress. Donate money for Android Wear/Pebble or submit code if you want.

Standard
Linux, UX/UI

Ask Fedora UX Redesign Updates #2

So taking into consideration most of the suggestions I had obtained during the recent Design FAD at Red Hat, the initial slides of desktop version are also ready. Maybe these are enough to start off with a basic CSS template which we can build upon iteratively while we work on more mockups for other major pages in parallel. Here is the updated mockup:

home-desktopJust a reminder that the color palette used here is not standard and its indicative. The standard Fedora color palette will be used in the code. The next mockups to be done are for the views for individual question pages, contributor/people page, the ‘ask question’ page and maybe the registration page if required. Most of the other stuff I think would be best done directly in the code. I was anticipating a bigger challenge in streamlining the design but personally I think, as Askbot apes the StackOverflow and similar Q&A websites’ UX to a large extent, the users already are familiar with flow of AskFedora. In any case, later on we can have something like this : http://askubuntu.com/tour – an Ask Fedora Tour page for beginners/new users so that the initial user-inertia reduces.

Contributions and comments welcome.

Standard
Linux, UX/UI

Ask Fedora UX Redesign Updates #1

The recently concluded Fedora Design FAD 2015 at Red Hat’s Westford office turned out to be quite productive where my idea of redesigning AskFedora user interface gathered some momentum. I met so many faces I had just always known as IRC nicks and above of all, enjoyed Sirko complaining to everyone for not playing Champions of Regnum that well during the gaming nights we had 🙂

So coming down to the point, I was joined by Zack (sadin) and Sarup (banas) for the initial redesign efforts. With their suggestions, I completed some high-fidelity mockups for the mobile and desktop interface intended to be used for Ask Fedora. As suggested by Sarup, we started with Mobile mockups first to get a simplistic view of user requirements. It can then be “stretched” for a desktop interface later on. After some feedback from Sirko, Emily, Mairin, Marie et al. here is a first mockup slide.

home-mobileTo get a context of changes, you will have to visit the current AskFedora instance and observe the changes. Newer slides and the desktop views are on the way. Even though this takes time, its important to have an idea of how you want your interaction with the application to be and FAD gave me a change to do some mockups before we dive into code and CSS. Which reminds me, that Zack and I managed to setup an Openshift repo of an askbot instance one night and would be mostly using it for testing out our design. (I also learnt Openshift awesomeness that night). Most of real usable UI updates will be posted on this repo : https://github.com/fedoradesign/askbot-test

Your comments and suggestions are welcome. More updates on the way.

Standard
India, Linux, UX/UI

Sad State of Sarkari Sites

I still remember the day when I first accessed internet in India. It was a hot Delhi summer day in August 1995 and I was in my dad’s lab. VSNL had rolled out internet first in government research labs I assume. My dad had brought me specially to office on saturday to show me this wonder. I fired up Netscape Navigator (many of you may remember it as the precursor to Mozilla’s web technology) and an IT assistant told me to type http://www.yahoo.com in the browser. Some lights blinked and approximately 10 seconds later some images appeared from a far off land with the help of some tired electrons that made this journey to my screen. I typed “Australlia” – yes with the typo in the search bar and half an hour later I knew a lot about Aborigines, Uluru, their art, culture, destinations to visit and such. I never had an encyclopedia at home and this was magic for my tiny brain. Soon, Indian government started making their web presence known and developed websites for their departments, ministries etc. They called them portals (not the one which Valve makes). It was all amazing. Such a giant leap for us.

Except for that fact that those portals with their ancient technologies have pretty much remained same till now. Duh.

To give you a glimpse, here is the website of Indian Meteorological Department (IMD). I urge you to go at http://imd.gov.in and explore the ancient wisdom of golden era engineers in their full glory.

Screenshot from 2014-07-26 19:27:07

IMD website. Such beauty, much wow!

Here are some more screenshots of famous websites that people visit :

Screenshot from 2014-07-26 19:30:16

Indian Railways website – Best viewed on Internet Explorer 1024×768. Wow!

Screenshot from 2014-07-26 19:31:00

CBSE website – Teaching future generations HTML 1.0 tech

Screenshot from 2014-07-26 19:43:57

University of Mumbai – A flood of NEW

Screenshot from 2014-07-27 13:42:01

MTNL Delhi – We provide 4G services and online bill payment – but have the worst website on planet

Screenshot from 2014-07-27 13:42:12

Ministry of RT and Highways – I’ll let you know who built all this stuff

Oh yes, that is a marquee and those tiny “NEW” things are so fabulous. Its like web fashion from 1990s returning never changed since 1996. Wait don’t go. Here is a list of websites I urge you to try :

http://mtnldelhi.in/

http://www.indianrail.gov.in/

http://cbse.nic.in/welcome.htm

https://negp.gov.in/index.php   <– security certificate expired

http://www.mu.ac.in/

http://www.isro.org/

EDIT:

http://www.nift.ac.in/ <– This is a design school. I know, borderline technical, but still its a design school!

There are numerous others with suffixes as  .gov.in or .ac.in represented by Government of India in some form or other but absolutely unusable by general public. I don’t think babus ever visit the websites or I wonder if someone actually ever cares about the websites from the sense of UX/UI perspective.

I have categorized some observations and here goes the actual rant..

The “New” GIF Syndrome

You may start crying that there is no uniformity in .gov.in domains or any government website. Well, you are wrong. Most of them suffer from this syndrome which make the UI puke-worthy.  Its the “New” gif. A remnant from the dinosaur era, these small gifs were created by web enthusiasts when gif was cool (the first time). It was an amazing feature of that era (no jokes) but its (really)^infinity annoying in the age of HTML5 and CSS. All government websites have made it a point to annoy people while making announcements by putting these tiny devilish GIFs. People may see it as just a blinking “New”. But here is what it actually looks like to me :

1386272038724160_animate

The Marquee Dance

Remember the <marquee> tag? Oh this wonderful tool to have fun with in the 90s. There is no shortage of this piece of archaic technology in these websites too.  I think its the worst tag ever designed. I don’t know how others see it, but its just so annoying to wait for 2 minutes just for the relevant announcement to scroll like a snail on the screen and then trying to catch it using the mouse as if a cat is chasing a mouse.

Those “Notice” PDF Links

Many times on such websites, from time to time, some links right from the home page (which for example says “Bus Schedule”) will point you to a shabbily scanned 10 page incomprehensible document of a schedule with all the official signatures, and rubber stamps still intact. There would even be a chai stain  or staple-pin mark somewhere or other if looked closely. I mean seriously guys? Make a schedule in Excel -> print it -> get it approved by 3 people -> page crumbles -> scan it -> convert to pdf using a shitty free PDF converter -> put it up as hyperlink on a govt website?? Even Jackie Chan’s logic would get screwed here. This is the worst form of information delivery. But at least its better than no information. When will the process get streamlined?

The Babu photu effect

Madame, ismyle pleej!“. Many websites also have images of ministers right in the headers. Refer to the images above. This is not so common, but not so uncommon too. Remember the fiasco over @PMOIndia twitter handle when it was gonna be archived? Well, ministers will not take any chance here.

The tiny multi-coloured serif fonts

This is another annoying thing. Minuscule serif fonts all scattered over with their red green and blue colors – creating an information overload. Along with the marquee and the NEW GIF (my soul cracks once each time I imagine that) the effect is amplified 100 times. The person just gets lost. Into the bottom of the ocean. Sometimes I feel they design the websites like this knowingly – just to hide some incompetency they may have.

The low-res myopic vision

So many aspiring photographers with their flashy DSLRs on Facebook and not a single one clicking professional photos for Government websites? It seems they have to do their best with 340×480 images, blow them up and plaster on their websites 😦 Look at the glory of those pixels. Such beauty in pixelated images. (/me weeps again). And those horrible logos. Probably done in MS paint 20 years ago and stretched using <img> tag all these years again and again and again with wrong aspect ratio. Even if there is a logo change, its still in MS Paint I think. Such dedication you see.

Unquestionably, India is a global IT leader. They do amazing things. There is no dearth of good web engineers and designers for sure. The websites of TCS, Wipro, Infosys are all well done. All private entities have wonderful websites – Airtel, Tata, Birla, ICICI, Even PSUs like ONGC etc. BUT WHY NOT GOVT WEBSITES? Why not even websites of central or regional academic institutions? Just look at website of any government engineering college in any state. The things which general public needs most is in the worst state. People would argue that internet penetration is not good and hardy anyone uses it. Well, you are wrong folks. Don’t judge a book by its cover.  Just see the amount of bookings done on IRCTC website each day. The indigeneous technology which CRIS has put up is commendable. Thousands of students use CBSE websites to search for study material and see results. Remarkable too, is the work done by organizations such as ISRO – they may have not launched a beautiful and informative website but they have launched a spacecraft to Mars 🙂 If you dig deeper in the IMD website, there are hourly images from Kalpana satellite and quite accurate doppler radar maps of weater in major cities. Just that nobody knows and ever uses it because its hidden beneath layers of obscurity and bad UI. This is the department that prevented a recent catastrophe in AP. We have engineers who can do this : http://railradar.railyatri.in/ A flightradar like app for Indian Railways (I don’t think many railways in the world – except DB provide such APIs to get moderately accurate running info on the web). But we don’t have engineers to design an efficient Indian Railways website? There are 3 separate websites related to Indian Railways – all confusing. I cry in the nights silently seeing these websites, tears rolling while booking railway tickets, looking at election results, so on and so forth. The pain is unbearable. Even if I want to help, maybe I won’t be allowed to as I am not in a sarkari job as the awesome guys there. They are very good and highly apt – but in UI/UX technologies of the 90s i think.

All this does not absolve the government from the leniency and giving arguably the worst UX experience provided on the web. There is no uniformity in the government websites and no way to actually get the head and tail of anything that goes inside. National Informatics Center (NIC) which I presume handles these major websites has at least redone its website (http://www.nic.in) so its not an eyesore anymore. (Thanks a lot guys) Same is the case of recently launched Mygov website (http://mygov.nic.in/), http://www.data.gov.in and Department of Electronics and IT website. I think they even tried to organize a hackathon! Good job. I just hope all the Govt websites start getting a facelift like these ones soon. I don’t know if its gonna be effective or not.

I showed the miserable websites to my friends here and we all enjoyed a few laughs. Then I saw beautiful govt websites of many countries. How can I explain to them that there is a high chance that some of these websites may have been designed by Indians but the Indian Government itself is incompetent to utilize their own engineers to give better service to its citizens. How and what kind of people do they hire in institutions like NIC? Is an entrance exam enough to show aptitude in design and development? Is there some in house training being delivered to engineers to bring them up to date? Foreign investors visit these websites for sure to see infrastructure support. Imagine what they will think when the visit Ministry of Highways website and see the badly “Photoshopped” fake looking images. Sigh.

Lastly, an open request to some randomly web surfing government IT officials and policy makers who may have reached here. Contact me folks, I will do designs for free. Trust me. For FREE! I will take out time from my research, sit in a foreign land and do it for free, just for you India – only if you keep your egos aside and invite the open world to help you. Start a major UX/UI redesign project for web and open source it. You will be surprised how many talented young minds will help you out.

Over and out. Spread the word.

EDIT :

I’ll just record some exceptions to the above here :

http://gectcr.ac.in/ <– This should be the example for all Govt academic institutions. They took the initiative. Kudos!

Government has a web design policy and guidelines doc. Saved for reading later : http://web.guidelines.gov.in/

Standard