WorkSuite /【アプリ作成レシピ】 マニュアル・掲示板アプリの作成手順について

概要

「 マニュアル・掲示板アプリ」とは文字通り、WorkSuite内に従業員が共通で閲覧・利用できるアプリを作ることで次のようなことが実現可能になります。

解決できる課題

• 社内にExcelやWord、Power point等のデータや紙で散らばっていた社内向け説明資料をHRBrainに集約
• 従業員から問い合わせの多い「ワークフロー」や「システムログイン用のURL」を一元管理
• 何度も同じことを聞かれるシステムの操作手順や利用する際の流れを共通化

• チャットツールでは流れてしまうお知らせ情報の固定可視化

   

アピールポイント

• これまでHRBrain上ではできなかった従業員共通の「掲示板利用」や「共通マニュアル」が作成できるように！！

完成のイメージ

HRBrainログイン方法の手順書①⇩

HRBrainログイン方法の手順書②⇩

HRBrainログイン方法の手順書③⇩

各種リンクまとめページ⇩

作成手順

1. データの準備（マスター情報の作成）

• アプリ編集画面の「データ」タブを選択し「マスター情報＞一覧」から「新規作成」をクリックします 。

• 「マニュアル画像」「ログイン方法案内」など、管理したい情報の箱の名前を入力して作成します 。

• 作成した箱をクリックしの「項目（列）」から「＋（プラス）」ボタンを押し、データの種類＞画像を選択して保存します 。

• 次に「レコード（行）」に切り替え「＋（プラス）」ボタンを押し、表示させたい画像ファイルをアップロードします 。

• アップロードされた画像をクリックすると専用のリンク（URL）が生成されるので、これをコピーして控えとして保持します 。

2. レイアウトの作成（パーツの配置）

• 「レイアウト」タブを選択し、画面左側のパーツ一覧から「コンテナ」と「テキスト」パーツを中央の編集エリアにドラッグ＆ドロップします 。

• 配置したパーツをクリックし、右側の編集パネルから「リッチテキスト」内に表示させたいテキストを入力します 。

3. リッチテキストへの画像埋め込み

• ヘルプページにある「リッチテキストで使用できるマークダウン一覧」＞「画像」部分を開きます 。

  • 参照：WorkSuite/リッチテキストで使用できるMarkdown一覧

• 参照ページ内の下記テキストをコピーし、アプリ編集画面のリッチテキストパーツ内に貼り付けます 。

• 2.データの準備 時にコピーした画像の専用リンク（URL）を上記「画像URL」と記載されている箇所（②）へ書き換えます 。

• プレビューモードに切り替えることで、実際に画像が正しく表示されているか確認できます 

• テキストの編集に関しては下記を参照ください

  • 参照：WorkSuite/リッチテキストで使用できるMarkdown＆HTMLタグ一覧

今回のヘルプページ画像内で使用しているもの

完成品

効果：赤色で下線がついた大きな見出し

コード：

<h1 style="color: red; text-decoration: underline;">HRBrain ログイン方法</h1>

完成品

効果：太字＋赤字＋段落作成

コード：

<strong>初めてHRBrainを利用する際は、パスワードの新規設定が必要です</strong>
<p></p>

1. 管理者から案内された<strong>「初回ログイン用URL（メンバー固有のURL）」</strong>にアクセスします。
<p style="color: red;">※メールで案内が届いている場合は、メール内の「初回ログインはこちら」のリンクをクリックしてください</p>

完成品

効果：黒太字＋段落作成＋リンクの新規タブOPEN

コード：

## 〜各種システムURL〜</strong>
</br><a href="https://tanemuranatsumi.auth.hrbrain.jp/login" target="_blank">▼HRBrain ログイン用URL</a>

4.必要なロール設定を行いアプリを公開する

• ロール設定については下記を参照
  • 参照：WorkSuite/STEP5：ロールを設定する