DEV Community

Paul C. Ishaili
Paul C. Ishaili

Posted on

Splash Screen, Onboarding Screen and Loading Screen Feature in a Vue Project.

Splash screens, Onboarding Screens and Loading Screens are vital mico-interaction feature in a web-app especially when following a mobile-first approach / methodology. It gives the finishing touches of a tandard web application.

Before we dive into coding, let me clarify what a Splash Screen is, what a loading screen is and why this micro-interactions plays an important role in the User-Experience of your application.

1. A Splash Screen

In context, a splash screen is the type of micro-interaction a user expereince, at the launch of an app, that is primarily to give primary information about the app while the app contents load for a first-time.

2. An Onboarding Screen

This is a type of micro-interaction screen display that houses the tutorial guides presentation (step-by-step) tour on how to use an app.

3. A Loading Screen

This can also be reffered to as a waiting screen. It is a type of micro-interaction that displays in between the request and response time of a user.

Top comments (0)