Great software products does not happen by accident, it takes rigorous and continuous effort to make one. It definitely is the team work indeed to make this possible. This is also a result from the combination of usability, functionality and aesthetics that helps to convert a visitors to possible customers which can also lead to increase in customer satisfaction, higher sales due to the ease of use or reflection of the value proposition provided my the product.

UX is a team sport its practice inside an organization falls on a broad spectrum in their ability to create maintain high quality, digital UX. …

In today’s digital age, 1000s of devices types are being used daily. As developers and designers, we are responsible to ensure our product works seamlessly across all devices, without a glitch. Responsive design isn’t an option, it’s a need. When developing a responsive web design (RWD), there are tons of CSS libraries available to help, or if you are confident enough, you could do the same with flex box and grids — a great combination for RWD.

We also use images in almost all applications we create. Making them display responsively is straight forward, but for better UX and page load time, we must consider the use of different images on different device sizes — this can be tricky. For example, you may need to compute the viewport size and render the file from the source. If not, the user will have to downloading full images when they visit a page. To solve it, there’s a ready-to-use feature in plain HTML. This is not a new feature though. It was introduced around 2014, and has already been shipped to major browsers. …

“As designers, we need to accept and embrace the world of metrics and use their amazing powers to change the way we’re doing things.”

— Jared Spool

We deal with a tremendous amount of data these days. These data come from user interaction after all. We have a vast number of tools that can help us in staying informed about the product we make. We are making products for humans. …

Let’s assume we want to extract some information from the web. We still can copy the information we need from the desired website. But, what if we want to extract large amount of data quickly as possible. In that case we need some automation needed. There is where web scrapping comes into play. Unlike, tedious and manual task of copy and paste the information required it helps in receiving thousands and even millions of data sets in a smaller amount of time.

What is Web Scraping?

Web Scraping is basically the process to extract data from a website. This technique mostly focuses on the transformation of unstructured data (HTML format) on the web into structured data (database or spreadsheet). Many large websites provides us with an API’s which allows us to access their data. …

We consume the information from the internet where in 2019 we had 4.4 billion active internet users. As designers we design numerous of products but we definitely don’t think of designing with web accessibility in mind which creates inclusive flow of information to all the kind of users.

Here we will learn how we can design digital products which are universally accessible to the users with visual, auditory, motor and cognitive disorder. It is not only about those who can’t see or can’t hear or any other specific category of disability. …

There has been lot of debate going on with the static site generators due to rise of JAMStack application. Despite the debate Gatsby has been widely used and have decent numbers of stars in Github. You can find the top static generators collection here.

🔋There are number of noticeable advantage of Gatsby. Some are:

• Less configuration needed, most done out of the box.
• SEO, Speed and performance optimization.
• Great community, nice documentation and growing plugin ecosystem.
• Ultimately better developer experience.

In this article we will be covering on showing how we can set up a system for managing content on any page of our Gatsby site. We will be making use of gatsby-node API to pull in content from Contentful and dynamically generate pages with it. …

Here we will implement a request access feature for our demo application. When a users can go into our application they can fill the form with name email and message, and submit it. We will configure and send that particular form data directly into our desired email.

For the form we will implement it using React hooks alongside with Tailwind CSS. Let’s take a look at the form we will be making.

Here we will go into steps on building fully function simple paginated react application with the use of hooks.

One of the most widely used UI component in our application is pagination. It can make website more friendly and keep us updated to other data as we requested. This also helps a lot in reducing the cognitive load and also enhances UX of the product.

There are many ways how we can implement pagination inside our application. We can hit request on each page or just fetch all the list at once and reflect inside our UI only the desired one we need are most common two ways. …