NLP Summit 2020 Hackathon Winners

Empowering our Farmers for a Better Future

The Problem

With global warming, climate change, and water pollution on the rise, we could be dealing with a harsh future. Food shortages are not something we want to add to the list!

TechCrunch reports that 40% of the world’s crops are lost to disease, we want to be a major breakthrough for agriculture, especially in poorer countries

It is not uncommon when we get to hear news about the farmers of our country committing suicides majorly due to crop failures, rising debts, failure of new farming techniques, etc. One of the banes of farming is the frequent loss of crops due to adverse weather conditions, lack of knowledge of farming techniques, and not taking the right action at the right point in time during pest attacks.

The farmers need to travel across villages, to their nearest Kisan Support Centre with a leaf sample, in order to get the right piece of advice from experts to solve their issues related to crops, fertilizers, and pesticides.

“Farming looks mighty easy when your plow is a pencil and you’re a thousand miles from the corn field.” -Dwight D. Eisenhower

Our solution?

The team combined their knowledge of Machine Learning, NLP, Computer Vision to develop a Robust Chatbot to automate tedious tasks like measuring crop quality, solving basic queries of the farmers, eliminating the need for travelling across villages during the pandemic, forecasting weather conditions, crop disease detection, etc. This chatbot won’t just speed up the process, but it will also help farmers to identify plants that have diseases and take necessary actions accordingly.

My Role

My primary role was to lead the design phase of the project as the UI/UX designer. The hackathon’s primary focus was on the use of Neuro-Linguistic Programming (NLP) but creating a product which could fully utilize NLP to solve real life problems requires a strong emphasis on UX.

Discovery

Approach for User Research

The hackathon kicked-off on the 6ᵗʰ October at 2 PM EST. Due to time limitations, All my user research was carried out through various problems and queries that I came across in the query database at Kisan Call Centre(KCC) maintained by the Open Government Data Platform India. This also served as our primary dataset for chatbot queries. The queries allowed me to quickly gather information from a sample of the target audience. Through this, I was able to determine that

• Farmers rely on traditional knowledge for farming techniques and disease identification
• Identification of plants that have diseases is a lengthy process even through government-provided aid
• Most queries involve weather data and the latest government schemes

Getting to know more about your local farmer ( Persona Development)

After my initial User Research, I developed a persona to help me guide my ideation process and to solidify the user’s needs, experiences, behaviours and goals.

Define

Brainstorming Session

Through User Research and Persona Development, I created How Might We and Point of View Statements. I was able to highlight the features that we would work on to solve the problem statement.

How might we help Mahesh increase his profits by introducing him to the latest farming methods?

1. Allowing the user to access information through articles
2. Curating a list of articles and blogs according to the user’s interest

How might we help Mahesh diagnose his crops in a faster and efficient way?

1. Create a chatbot to resolve queries
2. Option to diagnose disease through a picture of an infected leaf

How might we help Mahesh get reliable data without having to call a Kisan call centre regularly?

1. Adding robustness to the chatbot to let user’s know about favourable government scheme and information
2. Displaying reliable weather data with relevant metrics

Information Architecture

I mapped out the features in an information architecture diagram to further highlight the main features to get a clear idea of the product. Since we had a time limitation of 48 hours, we only had time to work on the main features to build an MVP(minimum viable product). Hence I decided to conclude my define phase here and to not use further methods like User Flow, Golden Path or assumption mapping.

Ideation

The define phase had shaped the product for me to craft the basic structure that I could use for validation.

Creating a Wireframe

I started the ideation phase by creating a wireframe of the key screens that would be used for testing.

Validation

It took me 8 hours to reach this phase where we had completed the basic structure of our product. Even with our limited time constraints, identifying pain points for improvement was an essential task. Using the mid-fidelity prototype that I created using the wireframe, I set out to identify the pain points that a user would face:

1. The chatbot was being sidelined and the main USP of using NLP and machine learning to detect diseases in crops needed to be reinforced.
2. We identified cases where a farmer may not be able to take photos of his crops, hence we created a repository of leaves ( infected and healthy) to make our chatbot more accessible

The UI

After working the changes into the wireframes, I started creating the visual design. I choose Green and Yellow for the entire app to establish trust, the green and white contrast is clean and gives a friendly aesthetic.

Some important points about the UI that I wanted to talk about :

1. We added three onboarding screens that would that help the user ease into the product’s experience. Onboarding helps give users a sense of what they’ll need to do in order to get what they need from an app or product. It’s a way of building confidence and trust with your user.
2. The most important aspect of our app was the chatbot, we wanted it to grab the user’s attention straight away while the weather and articles were incentives for the user to use the app even when he doesn’t want to use the chatbot

Epilogue

After 50 hours of sheer hard work and sleepless nights, the hackathon came to an end on 8ᵗʰ October at 4 PM EST. Phyto was chosen as the winner of the NLP summit 2020 hackathon and the team was ecstatic to hear the results

Our team had dedicated more than 12 hours to the design aspect of the product , this was not a priority for a lot of the teams who participated in the NLP summit but my team’s firm belief in using my knowledge about UX to craft a product catered for the user is what I believe set us apart from the rest of the competition. Winning the 2020 NLP summit and being able to meet participants from all over the world was a magnificent experience for us, the next phase was to refine this idea for the actual world, the project ended with us having a solid prototype but I would still like to conduct testing to improve the design and add more ways in which we can support our local farmers.

Phyto, A Hackathon Case Study was originally published in UX Planet on Medium, where people are continuing the conversation by highlighting and responding to this story.

In 2019, A group of students from Manipal University Jaipur set out to work and build their own Mars Rover. The objective was to design and build a next-generation assistive Mars Rover to take on Rover Mission 2020 by the Mars Society, the team participated in various international competitions and even qualified amongst the top 65 teams internationally. In this case study, I’m going to go through the challenges that I faced when I had to make a comprehensive data enriched control panel for the rover in my role as a User Experience Designer in this team.

Understanding The Control Panel

Simply put, the control panel is a platform to control and showcase data from a Mars Rover. It has two main functions

• controlling the physical functionality of the rover
• measure the rich ensemble of data that the rover provides

This two-pronged functionality of the control panel meant that the design had to be carefully crafted to accommodate control and data visualization. For my first task, I divided the data into functional sections and grouped them.

Roughing out my initial approach

My first approach was to build a multiple page experience where each section would get a separate page to display its array of information but this approach failed as the rover system needed to be continuously monitored, and a multiple page approach would make it tough for the user to keep track of all operations simultaneously.

The solution to this problem was to make a single page which was divided into grids where each grid would be tailored to a specific task, giving the user fast access to information that’s most important to them at that particular moment.

Working towards the solution

There were two different approaches that I could follow to arrange the cards on a single page, my goal was to make the page not look crowded with information while also providing maximum accessibility to the user. The two approaches were :

• Arranging Cards in a modular grid
• Making Expandable Card

I decided to implement both of these approaches and create a hybrid solution

• The cards would be modular and expandable, maximising space and increasing visual clarity
• The cards would have an option to expand while still maintaining the grid structure
• The user would be able to dive deeper into metrics while still being able to access the rest of the information with a single click

The Wireframe

The Dashboard

• The wireframe was made with the intention of enabling the user to see as many metrics and graphs on a single screen and not making the page look over complicated
• The modular structure helps the user to differentiate between metrics and gives breathing space to each section

• the expanded view provides maximum exposure to metrics and ability to quickly switch between different cards
• Icons displayed on the minimized cards would alert the user, warning them of unexpected situations

Result Logs

• I followed the same modular structure for result logs to make replication easy for developers
• I made sure that each pie chart had ample white space to improve the overall readability, this is important for metrics with a high rate of fluctuation

A clean data focussed UI

Font and Color Scheme

• I decided to use Rajdhani as the primary font throughout the control panel, the modularized Typeform is readable even in small font size.
• Tones of blue give a sense of reliability and calmness, the positive psychological response evoked by blue is one of the reasons why I choose blue.

The Dashboard

• I used tones of blue and teal to call attention to important areas of the interface like the primary navigation and various calls to action.
• The contrast between the light grey background and dark grey text makes the design easy on the eyes

• The line based pie charts have a high contrast between the dark blue and grey lines, making it highly readable even when the pie chart is small
• Two distinct error icons radiate a sense of emergency and draw attention to alarm the user

• Each section in the result logs page is given ample white space to make the metrics stand out

Final Thoughts and takeaways

Working on this project was a great opportunity for me, I had a chance to work with passionate people who had set out to create a mars rover from scratch. The task of creating a control panel was a complex problem with no clear solution.Condensing such a wide array of data into practical metrics while maintaining visual clarity was a huge challenge .I relied on design principles ( ample breathing space and using limited fonts to name a few) and color theory to come up with a solution to the best of my abilities.

Designing a control panel for a Mars Rover was originally published in Muzli - Design Inspiration on Medium, where people are continuing the conversation by highlighting and responding to this story.

Concept2Design ( Referred to as C2D) is an interior design company in Bangalore. They are a commercial and residential turnkey interior design services founded by young entrepreneurs who love challenges and are confident enough to meet them. Their mission is to create unique and life-changing concepts and designs reflective of the clients’ desire, ideas and lifestyle.

C2D needed a top-to-bottom website redesign which relied on smart content and responsive functionality to embody their mission: “To create unique and life-changing concepts and designs reflective of the clients’ desire, ideas and lifestyle”

In this article, I try my best to write a detailed account of my design journey and the entire UX case study of the redesign of the website. I am thankful to Concept2Design for allowing me to work on their website.

Stakeholder Interview

The first part of the job was an interview with the stakeholders to get an idea about the problems that the current website faces and the ideology that they want the website to represent. I believe that it’s really important to understand the thought process of the stakeholders and to know more about their views and business before you start working on their project. Talking to the stakeholders made me aware of the problem that they’re currently facing and the expectations that they have from the redesign

Pain Points (My Observation)

1. The Website was outdated, didn’t reflect the brand ideology and couldn’t communicate to customers.
2. It was difficult to navigate through the website, the flow of the website was unclear.
3. The website couldn’t address customer needs based on their requirements.

These were the main Pain Points that I observed during my analysis of the website, based on these pain points and Stakeholder interview, I set a few goals :

1. Make it easier for customers to get in touch and navigate through the website.
2. Find a way to distinguish between new, returning and potential customers and address their needs in different ways.
3. Explain the brand’s values, ideology and process in an easier manner and increase user satisfaction.

Competitive Analysis

I started with a list of competitors offering similar services and started comparing the features that they had in common and the distinctions that they had made.

User Interviews

It is very important to validate the pain points with user testing and to build a better understanding of the current C2D ecosystem and determine whether users already had an existing understanding we conducted three 1on1 user interviews.

I choose 3 Users who had used a similar use case or product so they could better understand the pain points or problems in the current flow, all the interviews were conducted over telephonic conversations.

Key Insights

All of the users were familiar with interior designing websites and all of them agreed that the current website lacked a proper flow, some key insights that I discovered are:

• There was no clear way for users to get quotations
• There was a lack of clarity in the process for users unfamiliar with interior design services.
• The users felt that the website couldn’t establish trust

User Personas

Based on my research, I was able to define 2 clear user types, around which I developed the following personas

Ideation & Working towards a solution

Based on Stakeholder Interviews, Competitor Analysis and User Interviews, I made an affinity diagram and started prioritizing and combining items in chunks. The problem statement that I decided to design for was :

“How can I make the website more engaging for current users and easier to navigate”

Content Strategy

My Content Strategy was to distinguish the 3 core categories of online users and to fabricate design solutions for each core user :

• Skimmers want to find the information they need and get out as quickly as possible. In this case, it would be ideal to have a clear CTA Button to direct the user to the portfolio.
• Lurkers will go a little deeper and browse more of the website. Here, I included a short trip through the main unique selling points (USPs) of the service and an option to view the services offered
• Divers want to take it all in and spend time exploring. For this user, the flow throughout the homepage was made easy to navigate through so the user could learn all about C2D and then a small part at the end of the page had a CTA button to contact C2D.

The Solution

I created a structural diagram ( Sitemap Flows) which showed the relationship between all components of the website, this allowed the entire team to evaluate the scope of the project and also acted as a checklist for designing and coding

This is the design solution that I came up with that had a solution for every journey

The previous home page was cluttered, it needed to establish trust while maintaining proper flow. The proposed design divided the homepage into several sections carefully separated so that each target group’s attention can be captured and can be directed to either the portfolio or directly to the contact us page.

Colours & Typography

The right balance for colour and typography is very important to set the theme that will represent the brand. It was important for the website to radiate simplicity, stability and to set a calm reflective mood. After experimenting with shades of teal, green and different typefaces, I decided upon a combination of celadon green and skobeloff used alongside champagne pink as an accent colour, the colour scheme gave a sense of simplicity and calmness. After many iterations, I found that a combination of Libre Baskerville and Poppins worked best with the colour scheme and gave a modern yet sober look to the website.

Wireframes and Prototypes

The three stages of Wireframing were:

1. Paper prototype was the rough initial draft of the home screen where I experimented with different layouts
2. Low fidelity digital Prototype made on adobe XD that was used to finalize user journey
3. High fidelity digital Prototype made on adobe XD that incorporated the desired colour scheme and typography.

Final Product & Takeaways

Redesign and user experience doesn’t begin with a pretty mockup, it’s founded on strategic planning and a design vision that focuses on User Feedback at every step of the process. The primary objective was to provide a digital solution to Concept2Design which would help their business, not to make an aesthetically pleasing website.

The Redesign of a website is built on strategic planning, the design solution that I’ve provided now needed to be carefully user-tested thoroughly to make further improvements. As a UI/UX Designer, I believe that my job isn’t complete until the solution that I’ve provided brings significant progress to the business.

Harsh Vardhan Singh

Redesigning an interior design service website was originally published in Muzli - Design Inspiration on Medium, where people are continuing the conversation by highlighting and responding to this story.