Forem: krishna kakade

How human psychology is used for user experience design in apps

krishna kakade — Wed, 11 Jan 2023 04:50:29 +0000

How psychology is used for UX design in apps👁️

First of all we will take the example of Instagram posts in relation with drugs!

The First Taste is free

Real-life example

Sugar is classified as a drug
You're in the Sweet shop,
You ask the shop owner for one sweet he will give you that for free to taste but later
you felt good and you want more
then you have to pay money to buy more!

Now In case of Instagram
You post pictures on Instagram and now you got 400 likes for free but after some time you wanted more likes than 1000 then Instagram asks you to promote posts for 10$ or 20$.

Shape the behavior
If you want your dog to play with you have to do one thing like throw ball at him if he kicks the ball or give it back to you give him/her biscuit unfortunately he/she didn't do it then don't do that, be a strict teacher.

Incase apps you're designing
For example in my Breath - mental health UX & UI Case Study

Perks for maintaining streaks

Maintain a streak for five weeks and get a free therapy session, plus two free sleep stories.

That's how you can shape user's behavior.

Bandwagon Effect

Like our mom says

if everybody jumped off a bridge, would you do it too?
With so many people on social media nowadays, it can be tempting to join in and spend a lot of time on these platforms. However, it's important to consider whether or not this is a good use of our time and whether or not it is beneficial for us.

Hick's law

Hick's law is a psychological principle which states that the more options are available to a person, the longer it will take for him or her to make a decision about which option is best.

Real life Example

When shopping at a Nike showroom or other quality store, it is often helpful to have a limited selection of options to choose from. For example, if searching for shoes, a customer may only have the choice between a few different models such as Nike Jordan One or Nike Jordan Airmax sneakers. This can make it easier to make a decision and purchase the desired item more quickly. By having a smaller number of options available, the decision-making process is streamlined, allowing customers to act more efficiently.

Note : Please take a look at my portfolio if you are hiring for positions in UX and UI Design Krishna's Portfolio

Wishing you a great day ahead, and thank you for reading!

Breath - Mental Health App (UX & UI Case Study)

krishna kakade — Sun, 01 Jan 2023 07:26:37 +0000

Breath UX & UI Case Study - An app that helps users deal with mental health issues.

I believe if you suffer from something suffer appropriately but make something out of it.
As a result of dealing with mental health issues for the past couple of years, I decided to make something about it. After joining Designerrs | UI UX Design Academy I saw a problem brief called "make a mental health app."
I immediately jumped into it because if you suffer from something, you should make something that can help others who are suffering from it too.

Learnings from this project

The topic of mental health is very sensitive when it comes to user research because most people want to keep things private, but having a proper user research interview question set helped me identify pain points, goals, and motivations.

The most important thing I learned about UX design as a designer was to put myself in the user's shoes so I could solve their problems.

After receiving constant feedback on designs and iterating based on that feedback, I understand the crucial role feedback plays in the design process.

Live Youtube demo of this project

Portfolio Link:- Portfolio Link
Behance Project Link :- Breath UX & UI Case Study
I want to express my sincere gratitude to those who helped me during the process of the project.
Manvi Singhwal , Shahid Ahmed, Shivani Bhardwaj , Tina Lidia , Aakanksha Jaykar , Shireen Bhat , Ishika Dhawan

This project is very important to me, and your valuable feedback will help me improve as a User Experience designer. Thank you, Krishna.

Tease of continuation in design - Say it without saying it

krishna kakade — Thu, 29 Dec 2022 07:18:48 +0000

In the world of web design & mobile app design, the concept of "tease of continuation" refers to the use of visual clues to suggest that there is more content or information available beyond what is currently being displayed on the page. This technique can be used to encourage users to keep scrolling or exploring the website/mobile app, ultimately leading to a more engaging and enjoyable user experience.

Practical Examples

Stripe Website

The Stripe landing page reveals that there is only one page available, and to view additional content on the website, the user must scroll down to access it.

By incorporating visual clues such as partially displayed images or text on the landing page, the website design uses the technique of "tease of continuation" to create a sense of curiosity in the user. This encourages the user to continue exploring the website, ultimately leading to a more engaging and enjoyable user experience. The use of tease of continuation in this way effectively draws the user in and encourages them to discover more about the website.

Here are some additional examples of how the technique of "tease of continuation" can be used in design:

Ultimately, the tease of continuation is a powerful tool for web designers & mobile app designers looking to create engaging and enjoyable user experiences. By using visual clues and other techniques to suggest that there is more to see on the page, designers can encourage users to keep exploring and ultimately stay on the website longer. This can lead to increased user engagement and satisfaction, ultimately driving more conversions and sales for the business.

Thank you for taking the time to read this information. I hope it was helpful and provided some insight into the concept of "tease of continuation" in design. If you have any additional questions or would like to learn more about this topic, please don't hesitate to ask.

Using Chat GPT in UX design process

krishna kakade — Thu, 22 Dec 2022 11:31:30 +0000

The rising popularity of Chat GPT has prompted many to speculate whether it will replace Google or Stack overflow, potentially replacing blue-collar jobs. Even though predicting the future is difficult, I wanted to consider how artificial intelligence might be used in UX design.
My attempt is below.

Let's Consider I have problem brief

Despite chatgpt taking over, how can UX researchers remain relevant

Input given to ChatGPT
Despite chatgpt taking over, how can UX researchers remain relevant do secondary search on this topic

The response I received from ChatGPT is as follows:

First and foremost, it's important for UX researchers to stay up-to-date with the latest developments and best practices in the field. This may involve continuing education, participating in professional organizations or communities, attending conferences or workshops, and staying abreast of new research and resources.
In addition to staying current, UX researchers can also add value by bringing a user-centered perspective to the design and development process. This can involve conducting user research to understand the needs, preferences, and behaviors of target users, and using this information to inform design decisions and improve the user experience.
Another way for UX researchers to remain relevant is to demonstrate their value to the organization by demonstrating the impact of their work. This might involve collecting and analyzing data on user behavior, user satisfaction, and business metrics, and using this information to make recommendations for improving the user experience.
Finally, UX researchers can remain relevant by developing a diverse set of skills and expertise. This might involve learning new tools and technologies, developing expertise in a specific domain or industry, or learning new research methods and techniques. By staying versatile and adaptable, UX researchers can position themselves as valuable assets to organizations in a rapidly changing field.

Using this Output, I can ask openAi to generate survey questions.

Input

Take the and generate 10 question from it about ux researchers thoughts on chatgpt. first three questions should be demographic questions.

Output

How familiar are you with chatgpt and its capabilities as a tool for UX research?

In your opinion, how does chatgpt compare to other tools and methods you have used for conducting user research?

Have you used chatgpt in any of your UX research projects, and if so, what was your experience with it?

Do you believe that chatgpt has the potential to significantly impact the field of UX research?

How do you think chatgpt could be used effectively in UX research?

Do you think chatgpt could potentially replace other traditional methods of UX research, or do you see it as complementary?

How do you think chatgpt could help to improve the user experience of a product or service?

In your opinion, what are the potential limitations or challenges of using chatgpt in UX research?

How do you think chatgpt could be improved or enhanced for use in UX research?

Do you have any predictions for the future of chatgpt in the field of UX research?

User Bio Generation

Input to Chatgpt

Krishna is shy and pursuing a career in UX design. He enjoys traveling, travels with his mom, and loves to do photography generate his user persona

ChatGpt's response to me

Krishna is a shy and creative individual who is passionate about pursuing a career in UX design. He has a strong interest in understanding the needs and preferences of users, and is dedicated to creating user-centered designs that improve the overall experience of a product or service. In his free time, Krishna enjoys traveling and exploring new places with his mom, who is his closest companion. He is also an avid photographer, and loves to capture beautiful moments and landscapes through his lens. Overall, Krishna is a talented and driven individual who is excited to make a positive impact in the world of UX design.

Final thoughts

Artificial intelligence (AI) is becoming more prevalent in various industries, and it is likely that it will continue to evolve and impact the way we work in the future. While AI can certainly make certain tasks easier and more efficient, it is unlikely to completely replace human jobs in the near future. One reason for this is that AI is not yet able to replicate the emotional intelligence and nuance that humans possess. For example, in the case of producing content, AI may be able to generate text or visuals, but adding emotional depth and understanding the context and audience for that content is something that only a human being can do. Therefore, it is possible that new job roles may emerge in the future, such as content refiners or AI operators, to augment the capabilities of AI and ensure that it is used effectively and ethically. Ultimately, it is important to stay informed about the developments in AI and be proactive in adapting to new technologies, while also being mindful of the potential impacts on employment and society.

thanks ChatGpt for helping me :)

Let me know your thoughts in the comment section!
Thanks signing off Krishna.

Figma plugins that will help you succeed at your next UI/UX design project

krishna kakade — Mon, 14 Nov 2022 05:33:06 +0000

Hello there ,
Hope your doing well ,

The following Figma plugins will help you succeed at your next UI/UX design project

html.to.design html.to.design is the plugin where you can paste the website link that you want to redesign you will get the full canvas of the entire website.

Freepik
Freepik is the plugin where you can find illustrations and images for free
Iconify
Iconify is the plugin where you can find all the icons that you needed for your next design project.

Unsplash Unsplash is the plugin where you can find high quality images for your next UI/UX design project

As of now this are the list of the plugins I use most for my UI/UX Design projects.

An overview of where I've been, what I've done, and what I've learned.
Hope everyone is doing well, I haven't posted here in a year, so for the past year, I have been a software developer in one company. However, after working there for six months, I realized that I was interested in creative work. It has also been a challenging year for me, so I had to leave that job for obvious reasons, so I am now working on UI/UX case studies and design projects.
Lastly hello @ben How you been all well ?

My humble request to everyone: if you find any opportunities related to UI/UX Design or product Design roles, please let me know.
Thanks,
Krishna.

Getting started with chrome developer tools

krishna kakade — Thu, 15 Jul 2021 06:58:18 +0000

Hello there :)
today we are going to learn practically about how we can use chrome developer tools if your into webdev/security related domain then it is more beneficial to you .
So let's start
First thing you need is latest chrome browser installed then do a right click and look for Inspect or do CTRL+SHIFT+I then you can see developer tools section out there.

In this above image in preferences you can do basic things like theme changes and formatting disable / enable javascript and in the Workspace section you can add your own reactjs or any project and you can change code from your browser also and in the experiments section those are upcoming features you can test it out in your browser in Devices you can add custom devices or existing devices for checking in different different devices how your website/web-app behaves or work and in throttling you can customise your internet connection speed according to your needs and in shortcuts you can use CTRL+L for clearing console and many more shortcuts to save your seconds/minutes :)

*Elements section *
if you go the elements section and did right click to the header or any tag you can edit that with right click and then below thing

and also if you do select to the specific heading tag or paragraph then after right clicks you can copy all his CSS styles and improve it and use it for yourself or for your project like implementing twitter animations for buttons in your webapp

and also you can do duplicate or copy of the elements

Sources
In the sources section you we can create breakpoints for our code which to execute or not or stop only execute not debug
like that

If you have ul(un ordered list and you want to copy this js path particlular list item then you can get js path by this)

and you can remove that item using this thing

function onClickEvent(){
    let mycount=1;
    alert("your a best learner"+mycount+'excercise');
    document.querySelector("body > ul > li:nth-child(2)").remove();
}

we use it as IDE(Integrated Development Environment) chrome workspace.

Console
"Preserve Log upon Navigation"
will persist console content by default. You can clear the console log by clicking the 'clear' button in the top right or opening and closing the tools.
we can use console.log to debug and for solving errors and also for displaying data more precisely using console.table().
Network
In this section you can turn on throttling like this change your network within in the browser

and also you can check how much time content is taking to load

Application
if open same application in another tabs then that data should be shared that called localstorage and data that is limited for that Session only that called sessionStorage we can save that data for that session
you can add items to sessionStorage using this

js sessionStorage.setItem("name","krishna"); undefined

Performance
For knowing more performance using you can refer web.dev
Security
you can know more about site is secured or not which certificates like digicerti site is using .

Memory
We can take heap snapshots to see it to take JS heap snapshots, analyze memory graphs, compare snapshots, and find memory leaks.
Know more hear

thank you for reading
And also i am open for front-end web development jobs and i have experience with react(8 months) a if anyone is having opportunity related to this domains please let me know i am passionate about learning new things and implementing projects.
have a great day ahead :)

Feature Dev.to should have 🤔

krishna kakade — Tue, 08 Jun 2021 04:27:10 +0000

Hello there 😊
Today i am going talk about one feature Dev.to also known as AKA Forem should have
We all know dev.to is one of the most liked platform by developers community and also having more than half million users i think dev.to should one feature Introducing
DevMeet
So that now question arises how it is going to work now we know most of the times we don't have partners for the hackathons personal projects and even though for the startup or business ideas we can create thing like fellow developers who is going to click on Meet tab then we can get from the user dev account and then we can get details why you want to use DevMeet and then there should be filters like in which category you want to chat with developers with audio/video and also screen-sharing option and if i click on for hackathons/devfriends we can get connected to the person according to there interest and also for filtering we can show limited filters in (i) section btw if i had a ipad i can draw this things quickly how this can work and where to put or not and more UI thing so like this we can implement this feature.
and also with this feature the engagement of the users will also increase on devto and also in DevMeet we can show ads if dev wants generate revenue from the DevMeet

if anyone is having other ideas you can discuss in the comment section welcome have a great week ahead :)
bye if your doing good then this gify is for you

It is opensource but still some rights are reserved :)

Review of Ubuntu after 4 months of daily usage

krishna kakade — Sat, 05 Jun 2021 11:11:14 +0000

hello all In this article
I will explain of experience of ubuntu after 4 months of daily heavy usage.
Firstly this my first-time regular usage of ubuntu firstly I am a windows guy but I have tried ubuntu a couple of times but not heavy regular usage so in this article I will pros and cons of ubuntu and also the problems I face and how I solved those things.

Overall UI(User Experience) review
Transitioning to ubuntu after using windows more than 3 years of regular usage firstly I am excited for the change new ecosystem I didn't find any flaws or complications in UI of Ubuntu 20.04 infact Ubuntu feels like Mac OS to me that is kind of cool thing now question arises what if there is UI freeze kind of thing
how I am tackling with UI issues
In case of windows my laptop is used to show 100% disk usage and because of that my laptop used to freeze daily so then I have to do restart again and again and I having pretty much good hardware 16gigs of RAM 2 TB hdd but I don't have ssd:( Now in case of Ubuntu as a primary operating system it's been four months now hardly my UI doc and overall UI freezed less than 5 times and if that happens like user interface not responding then simple fix for that is ALT +F2 and just type r in that box and it's done issue solved 💪😄👌 sounds cool right but it feels better than sounds cool 😊 so no major issues with UI everything works fine.
So-called command syndrome
Most developers/users think ubuntu is hard to use no that is the myth of the group of folks because as we need to install apps/programs in ubuntu manually but there thousand of resources available on the internet like if need to install vscode or lmms there is installation command guide available for that. so installing and removing the program is not big task.
and all development thing works fine and no worries with that every App that developer need that is available in linux.
Problems for that i didn't got good solution for

react native installation doesn't work
some times music breaks not always once in while. *Only thing i miss in this OS is playing games i tried epic games through lutris but didn't worked that is only sad other thing smooth like butter * That's it for this one . thank you for reading :) Should you switch to linux My Ubuntu version is 20.04

How I got my first job with the help of DevCommunity☄️

krishna kakade — Mon, 26 Apr 2021 12:57:09 +0000

Firstly hello😊👋 all hope you're doing good and taking care of yourself. It's been a while I haven't written anything so in this article I will describe the story of how I got my first job.
Contents

Background Story
How the dev community helped me and some tips Let's Start Background Story As I am a final year computer science graduate student in this phase of life you need to decide whether you're going to do a job or you're going for higher studies in my case since the sophomore year of my degree I started doing things that are going to help me to get a job but honestly I like being a student in this student phase you can experiment on so many things and also you don't have to worry about so many things like future and all you just need to do studies and learning new things/building new things as per interest and then rest this is it but things change as we grow. and also I like to do research on things and I also did some research kind of work here Basic Research Work because the research thing I thought about higher studies in some well known foreign universities but because of COVID and some financial reasons that thing I put on hold but in future at some point in my life, I will try to do research that can help humanity. And then honestly I saw many students doing internships in the final semester I got many opportunities but I rejected those things because I wanted to experiment with the things and I did my overall reaction for my this decision is in between neutral. after this thing, I took small steps towards getting a job those things I will explain in the upcoming paragraph. How DevCommunity helped me to get a job Firstly I applied to 4-5 good companies with help of their careers section few startups also my resume got selected I given interviews also but in some cases in coding sections and in some case they rejected me because they are searching for experienced candidates. Then I thought I am having 40credits in my dev account then I created the one listed below is an example of that 5 credit per listing then for the next two-three days, I haven't got any response and then two companies contacted me then I gave an interview of one company after doing all the like interviews and stuff they said we need a more experienced candidate. and then another company contacted me I was given first interview this time the interviewers and company folks are so helpful and kind also then said we will give you one coding assignment complete that and let us know then and then i completed that exercise and then directly they offered me the job as a Jr FullStack developer Soon I am going to join this company that's good news in these tough times. all the details of the company will reflect on Linkedin soon.

Some Tips

If you're going to apply for a dev job then build a project document your learnings on the blogs build something cool and contribute to the opensource projects and apply through careers sites or LinkedIn. and in the job we are going to use reactjs/meteor js/node/express/MongoDB This is my new chapter of life. stay safe take care Thank you mother/grandmother and relatives and Devcommunity. that's all I did have a great day:). Note:- I know everyone is missing those trips vacations those happy times with family older grandparents i miss that too because of covid I can't go there I will go to meet my grandparents after and then Dalai lama(Hopefully as soon as possible) these are personal topics I am sharing here😊.

Final Submission SpaceTravel is released 🚀🛸

krishna kakade — Sun, 10 Jan 2021 06:39:17 +0000

What We built

We built a SpaceTravel web application in reactjs and also using its other libraries and other NPM packages this application is divided into 4 different components are following

First component:- In the first component there is one 3D earth that is built with help of three.js and a library called ReactGlobe in react and also there is one navbar those links are linked to them all components.
Second Component:- In we used NASA APOD API that APOD(Astronomy Picture of the day)API content is regularly updating on our website also that content is dynamic on that text we performed Text-to-speech with help of react-speech-kit library and also cool designs are there and also there is one button called search that is linked to another component and also now there is random APOD picture feature is there click on it to view those pictures.
Third Component:-Third component is search.js in this component there is one search button for that we used unsplash-js API and also after clicking on search images will be load there and you can preview those images also you can download those images and other cool stuff is given there.
Fourth/Fifth/sixth Component:- Fourth component is footer.js includes article links and authors of the project and other components are navlinks.js and notfound.js this all the components of this project.

Category Submission:

Random Roulette

App Link(Live Demo)

Live demo link🔥

Screenshots

Zoomed out because of taking whole that's some things are not visible

For more details Youtube video⤵️(Note:- But now we updated new features for that check live demo)

Link to Source Code

krishnadevz / SpaceTravel

SpaceTravel app in reactjs and with help of 3D libraries like 3JS and in second part used NASA open API for getting contents and also text-to-speech and many more things (unsplash api and stuff and download preview many more RANDOM APOD stuff )check the live demo and readme of the project.🌠

`</🌠>`SpaceTravel🌍`</🛸>`

Key Features and basic Description of project

First Component of this project and is 3d earth and also it is built with help of reactjs and threejs liraries and also there is one footer component below and for routing pages we used react-router library
Second Component is fully dynamic means that content is regualry updated for that we NASA APOD(Astronomy picture of the day) API and also there one text-to-speech button is there that uses react-speech-kit library please don't overuse the api and don't click again again on that text to speech icon and now also there is new random APOD images feature and many more check the articles for that and live demo links .
3rd component takes input from users and shows images(those images coming from unsplash api) according user search and also we can download those high resolution images and preview of those things…

View on GitHub

Permissive License

MIT OpenSource License

Background

Since a childhood i love the space that's why i thought we can do project on that and also this idea is unique and also we added new features too that makes SpaceTravel creative and unique .

How I built it

I learn so many things and also solved many issues also and also hally did a great job.
if you want to know what whole Journey of our hackathon then check series of all articles from Day1 that links will be shown at the start of this article i am working on this project since last week of 2020 i love the journey and wonderful experience.

Authors

Krishna
Hally

Team Members

krishna Github👉krishnadevz
Hally Github👉hally

Additional Resources/Info

All details are covered in the series of previous articles and in github repo dependancies section Thank you for reading and have good day all 😊 We did it 🌠

SpaceTravel final changes and newly updated UI improvements/new search component many more details

krishna kakade — Fri, 08 Jan 2021 09:50:38 +0000

Note:- If you want to know my hackathon journey how we worked you guys can check out series of articles for this hackathon

Hello all 😊👋
This article is continuing with last so as if you're following the series then your knowing 3rd component is done but some responsiveness/UI related issues are there at that time but now all things are fixed and improvements are done by @itshally she joined at last moment but work done is looks cool.
and also we added new components:-

footer.js
search.js
footer.js component includes information developers and authors and articles links and a short description of the project etc. This is how the First component of the app looks like now after including footer.js component zoomed out snap

*How Space.js component looks like now text to speech icon and also newly updated UI and other things see screenshot⤵️ and that search button for newly added component stay tune for knowing more about that *

And also today I added a new search.js component for that I used Unsplash API and after right-clicking on those images, you can download those high-resolution images in your local system see snaps of that ⤵️

too many (20)images because adding more screenshots

and now this it for this article after this article final submission article will come for this dohackathon
Authors

Special thanks

@itshally for making the app better also she is a core contributor to this project thank you
special thanks to shraddha didi for availing hosting for me by adding their credit card thank you so much, god, bless you onkar khedhkar Onkar Khedkar and shook goud for suggesting changes and inspiring me to do good stuff. This is for this article tomorrow we will submit our project final submission and also we will release the app publicly under the MIT license. thank you for reading have a nice day all.😊

Day 4 text to speech is done for second component and more about dohackathon

krishna kakade — Mon, 04 Jan 2021 16:11:15 +0000

Hackathon Journey
hello all 😊👋
In this Day 4(note day4 is just for the name I am working on this stuff for 1 2 weeks) article of the digital Ocean hackathon, I am going to write about how I did things and which things I completed till today so let's jump into the article now.

If you are following this series then you are knowing the second component of this project is almost completed already if you're not following the series then somewhere below you can find the series thing you can check out.

As I yesterday talked about the next feature of the second in day 3 article at last so today I worked on that feature

Worked on text-to-speech in reactjs using react-speech-kit

following changes are made in Space.js file for adding text-to-speech feature

const [ setValue] = useState('');
const { speak } = useSpeechSynthesis();

//firstly enabling text-to-speech on API generated text seems difficult task to me but after few minutes of thinking and looking at the code carefully I did below I will show that I did it.

  <p className={styles.space.explanation} value={photoData.explanation}
        onChange={(event) => setValue(event.target.explanation)}>{photoData.explanation}</p>
      </div>
    </div> 
    <div>
    <button className={styles.button} onClick={() => speak({ text: photoData.explanation })}>Listen 🔊</button>
    </div>

and space.modules.css⤵️ for that button means text-to-speech one

.button {
  display: inline-block;
  padding: 15px 25px;
  font-size: 15px;
  cursor: pointer;
  text-decoration: none;
  outline: none;
  color: #fff;
  background-color: #0719bb;
  border: black;
  margin-left:150px;
  margin-right:100px;
}
.button:hover {
  background-color: #101110;
}


.button {
  text-align: center;
  background-color: #384ab1;
}

live view of the button it is just screenshot repository will be updated related to that soon

For detailed code check previous articles codebase section

as per my views, this component is done but I am thinking instead of the next button (I am thinking of exploring new things related to space) for that I will fetch another NASA open API and I will make a space travel web app as interactive as possible that component will be 3rd component and 4th component is going to be about space travel like references and short info about project and me and special thanks section.
that's it for this article.
thank you for reading have a nice day all.😊

special thanks to
onkar khedhkar Onkar Khedkar and shook goud for suggesting changes and inspiring me to do good stuff.😊😊