I use Taro framework to develop, so this example also takes Taro code as an example, if you use small program language, uni-app and other frameworks, do not worry, because the principle is the same.

First, understand the design principle.

The key to the problem is "how to judge the first opening". There are two ways:
1. After opening the page, save a flag to session locally.
2. Interact with the server and store a unique identifier to the database after login, such as openId.

Component Code

Tooltip.jsX

import Taro, { Component } from '@tarojs/taro'
import './tooltip.css'

class Tooltip extends Component {
  constructor(props) {
    super(props);
    this.state = {
        isShowTip: true
    }
  }
  componentWillMount() {
    setTimeout(() => {
      this.setState({
        isShowTip: false
      })
    }, 3000);
  }

  render() {
    const { isAdd } = this.state;
    return (
      <View className={!Taro.getStorageSync('flag') && isShowTip ? 'tooltip-box' : 'box-hide'}>
          <View className='arrow'></View>
          <View className='tooltip'>
            <Text>click「Add applets」，Next visit is more convenient ></Text>
          </View>
        </View>
    )
  }
}

export default Tooltip

3. Adding Styles

tooltip.css

.tooltip-box {
  position: fixed;
  top: 0;
  /* left: 0; */
  right: 0;
  z-index: 999;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  flex-direction: column;
  width: 600rpx;
}
// 34b5e2  ff6d01  0193ff  ff0114  54ff01
.arrow {
  width: 0;
  height: 0;
  padding: 0;
  margin: 0;
  margin-right: 120rpx;
  border-width: 20rpx;
  border-style: solid;
  border-color:  transparent transparent #0193ff transparent;
}
.tooltip {
  background-color: #0193ff;
  box-shadow: 0 10rpx 20rpx -10rpx #0193ff;
  border-radius: 12rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60rpx;
  padding: 0 20rpx;
  margin-right: 40rpx;
}
.tooltip > text {
  color: #FFF;
  font-size: 28rpx;
  font-weight: 400;
}

The above components are developed and introduced into the required files.

Scan the code to see the effect