Page Design - UI KIT
Last updated
Last updated
What is UI KIT?
This kit includes all types of bulletin board features provided by Swing2App.
You can view the general board UI, location registration (map)board, group chat, calendar, and stamp board functions from here and apply them to your app.
Below, we'll show you how to apply each bulletin board UI to your app.
The bulletin board is a feature that allows administrators to make posts for in-app community use, and users who use the app can also register their posts.
The Swing2App provides a variety of bulletin board-style UI.
You can create a board for each UI-specific style and apply it to your app to make use of it.
1)On MakerV3, go to the STEP3 page
2)Select any menu
*If you don't have any default menus, please create a new one by clicking on the [+] Add button.
3) Enter the name of the menu.
4) Select the [UI KIT] option from the page design.
5) Please click on the [Bulletin Board] option.
6) Preview the board you want to register and click on the [Apply] button. (Hover the mouse cursor over the bulletin board page to see the Apply button)
*NOTE
*I haven't created a bulletin board, but I can see that there is a bulletin board.
It's a sample built-in bulletin board, to show how each board type will appear in your app.
Therefore, before using the bulletin board feature, please create a bulletin board.
Go to the *App Manager page - Click on the Services option - Click on the Bulletin Board, and delete the unused/default bulletin board.
Now, please register the board that you wish to apply to the app.
7) On the MakerV3 page-> Press the [Save] button at the top of the screen to apply it to the app.
If you select the Preview button, you can see how the page will appear in your app. (virtual machine).
*After applying a page, you can also check how the page is applied to the app through a virtual machine.
*Menu icon: During the production phase, menu settings are not required.
So, please apply additional menu settings as per your requirement.
Check out the detailed manual on how to create a bulletin board and apply it to your app.
☞ Create a board manual
Location registration is a map board, you can use it to register any address in the app ~!!
It's a location registration feature that you can use when you need an in-app map to guide your customers.
The map function is provided in conjunction with Kakao Map.
The map board allows you to enter a variety of details, such as a business address, business description, directions, homepage, phone number, business image etc.
1)On MakerV3, go to the STEP3 page
2)Select any menu
*If you don't have any default menus, please create a new one by clicking on the [+] Add button.
3) Enter the name of the menu.
4) Select the [UI KIT] option from the page design.
5) Please click on the [Map Board] option.
6) Preview the board you want to register and click on the [Apply] button. (Hover the mouse cursor over the bulletin board page to see the Apply button)
*NOTE:
*Please create a location registration board first. If you don't create one, the location registration board won't appear on the screen and won't be applicable to your app.
*To create a location registration board, you should click on the [New] button on the UI KIT screen, or you can create a bulletin board from App Manager-Service Management- Board Management.
7) Click on the [Save] button at the top of the screen to apply it to the app.
*If you select the Preview button, you can check how the page will look with a web preview (virtual machine).
*After applying a page, you can also check how the page is applied to the app through a virtual machine.
*Menu icons during the production phase are not required.
In the manual, we proceeded without such settings, so please apply additional if required.
Please check the detailed manual on how to use the location registration (map) bulletin board.
☞ Location Registration (Map) Bulletin Board Manual
Within the app, multiple users can chat at the same time, and you can also chat with administrators and multiple users.
You can also set chat room permissions for each group of members, and you can also set up a secret chat room where app users need to enter the password to access the chat room.
1)On MakerV3, go to the STEP3 page
2)Select any menu
*If you don't have any default menus, please create a new one by clicking on the [+] Add button.
3) Enter the name of the menu.
4) Select the [UI KIT] option from the page design.
5) Please click on the [Chat Board] option.
6) Preview the board you want to register and click on the [Apply] button. (Hover the mouse cursor over the bulletin board page to see the Apply button)
*Please create a group chat board first. If you don't have a group chat board, it won't appear on the screen and won't be applicable to your app.
*You can select the [New] button on the UI KIT screen, or you can create a bulletin board from App Manager-Service Management- Board Management.
7) Press the [Save] button at the top of the screen to apply it to the app.
*If you select the Preview button, you can check how the page will look with a web preview (virtual machine).
*After applying a page, you can also check how the page is applied to the app through a virtual machine.
*Menu icon during the production phase, menu settings are not required.
In the manual, we proceeded without any input, and please apply additional if necessary when creating the app.
For details on how to create a group chat room and how to use it, please refer to the manual below.
☞Group Chat Room Manual
You can easily register key events in your calendar, and businesses that need to manage bookings can record their reservation status by date and time.
In the calendar, you can also keep important news and announcements.
1)On MakerV3, go to the STEP3 page
2)Select any menu
*If you don't have any default menus, please create a new one by clicking on the [+] Add button.
3) Enter the name of the menu.
4) Select the [UI KIT] option from the page design.
5) Please click on the [Calendar Board] option.
6) Preview the board you want to register and click on the [Apply] button. (Hover the mouse cursor over the bulletin board page to see the Apply button)
*Please create a calendar board first. If you don't have a stamp that you created, it won't appear on the screen and can't be applied to your app.
*You can select the [New] button on the UI KIT screen, or you can create a bulletin board from App Operation-Service Management- Board Management.
7) Press the [Save] button at the top of the screen to apply it to the app.
*If you select the Preview button, you can check how the page will look with a web preview (virtual machine).
*After applying a page, you can also check how the page is applied to the app through a virtual machine.
*Menu icon during the production phase, menu settings are not required.
In the manual, we proceeded without any input, and please apply additional if necessary when creating the app.
For a detailed manual on how to use a calendar, please check the manual below.
☞ Calendar How-to Manual
Stamps are mobile online coupons that allow administrators to add stamps to a user's account.
You can use it in conjunction with a coupon. The administrator can add a stamp with the membership number issued by the app, or you can add it by taking a QR code.
When you register for the stamp board, you can add a stamp with the QR code and membership number that are automatically generated.
1)On MakerV3, go to the STEP3 page
2)Select any menu
*If you don't have any default menus, please create a new one by clicking on the [+] Add button.
3) Enter the name of the menu.
4) Select the [UI KIT] option from the page design.
5) Please click on the [Stamp Board] option.
6) Preview the board you want to register and click on the [Apply] button. (Hover the mouse cursor over the bulletin board page to see the Apply button)
*Please create a stamp board first. If you don't have a stamp that you created, it won't appear on the screen and can't be applied to your app.
*You can select the [New] button on the UI KIT screen, or you can create a bulletin board from App Operation-Service Management- Board Management.
7) Press the [Save] button at the top of the screen to apply it to the app.
*If you select the Preview button, you can check how the page will look with a web preview (virtual machine).
*After applying a page, you can also check how the page is applied to the app through a virtual machine.
*Menu icon during the production phase, menu settings are not required.
In the manual, we proceeded without any input, and please apply additional if necessary when creating the app.
For a detailed manual on how to register a stamp board and use the stamp, please refer to the manual below.
☞ Stamp Use and Registration Method Manual
