Skip to content

Latest commit

 

History

History
223 lines (157 loc) · 11.7 KB

UserGuide.md

File metadata and controls

223 lines (157 loc) · 11.7 KB

User Guide 📖

Table of Contents

1. Introduction

Clique is a messaging-cum-calendar mobile app for the masses. The main focus of the app is group calendars, where your group chats have their own personalized calendar for members to get in sync with the group events! Many of our group chats we create involve some form of event that will be planned in the future. Be it your group project where you will have frequent meetings, or simply your clique of best friends that will hang out all the time, there are many a times where your plans are buried deep in a heap of messages. Clique aims to integrate the experience of group chats and calendars, to help better event planning and ensure that you never miss an event again!

2. Quick Start

  1. You will need an Android phone to download the app.
  2. Download the app into your phone.
  3. Open up the app, and sign in with your phone number.
  4. Complete the CAPTCHA and an SMS with a verification code will be sent to the number you input.
  5. Enter the verification code and voila, welcome to Clique!

3. Features

3.1 Phone Number Sign-in

To create an account with Clique, you will be using your own phone number as the sign-in method. An SMS verification code will only be sent to your number, so no two users will have the same account.

  1. Enter your phone number that starts with +65 into the text input box.
  2. Tap 'Continue', and upon doing so, an SMS verification code will be sent to your phone number.
  3. Enter the verification code into the text input box to verify.
  4. You will then be navigated to the Groups screen if you are already a registered user, else you will be navigated to input your username and profile picture.

3.2 Groups

Groups are your chatrooms. You can create a group with one (private messaging) or more member (group messaging). You can add

  • group picture
  • group name
  • members (must be in your contacts and also have a Clique account)

How to create a group:

  1. Tap the '+' button on the Groups screen, and you will be navigated to the Create Groups screen.
  2. Here, you will be asked to allow the application to access your phone's contacts if you have never allowed this permission before.
  3. A list of your contacts already using Clique will be showed on the screen.
  4. Tap on the contacts you would like to add to the new group to select them.
  5. Tap on the forward-arrow button to continue, and you will be navigated to a screen to input group name and group profile picture.
  6. Tap the circle (default profile picture) to change the group profile picture. You can get a new picture from either your phone's gallery or the camera.
  7. Type your group name in the text input box.
  8. Tap on the forward-arrow button to create the group. You will then be brought back to the Groups screen.

Once created, you can do the following

  • view the group information
  • change the group name or picture
  • remove existing members/ leave the group
  • add more members

To access such features, you must go to the Group Information Screen first.

  1. From the Groups screen, tap on the group chat.
  2. Tap on the group profile picture or the group name on the top of the screen to access the Group Information Screen.

To edit group name or group profile picture:

  1. Tap the 'Edit' button on the top-right of the screen.
  2. Tap the circle (current group picture) to change the group profile picture. You can get a new picture from either your phone's gallery or the camera.
  3. Type your group name in the text input box.
  4. Tap on the forward-arrow button to update the group information. You will then be brought back to the Group Information Screen.

To remove existing members or leave the group:

  1. Swipe right on the member you would like to remove (yourself to leave).
  2. Press the delete or leave button that appears.
  3. A modal will pop up to prompt you to confirm your action.
  4. Tap on 'YES' to confirm.

To add members:

  1. Tab the 'Add Member' button.
  2. Here, you will be asked to allow the application to access your phone's contacts if you have never allowed this permission before.
  3. A list of your contacts already using Clique will be showed on the screen.
  4. Tap on the members you would like to add into the group.
  5. Press the forward-arrow button to add these members. You will then be brought back to the Group Information Screen.

3.3 Messaging

You can send text messages as easy as other messaging apps. To navigate to a group Chat Screen, from the Groups screen, tap on the group chat.

To send a message:

  1. Type on the text input at the bottom of the screen to enter a message.
  2. Tap the send button to send the message to the group.
  3. You should see the message be propagated into the group messages.

3.4 Notifications

We have now implemented push-notifications and unread messages count into Clique. Push notifications will appear whenever a new message is sent to any of the groups that the user is in. A number will also appear on the Groups screen beside every group to indicate the number of unread messages in each group for the user.

3.5 Events

Each group has a calendar feature which can be accessed from the Chat Screen through the calendar button from the top right corner of the screen. Here, you can view all Events that are private to this group, either created by yourself or other group members.

Events are part of calendars, and you can easily create new events from the group calendar! You can add

  • Title (minimum)
  • Start time
  • End Time
  • Location
  • Notes

To create an event:

  1. Tap the '+' button at the bottom left hand corner of the screen from the Chat Screen. Tap on the calendar icon. You will be navigated to a new screen to create the event.
  2. Here, you can add the title of the event (required), the starting and ending date and time of the event (default is set to current date and time), location of the event (not required), and additional notes (not required).
  3. Tap the 'Publish' button below to publish the event to the group. You will be navigated to the Chat screen.

Once created, you are able to

  • see all the information of the event
  • respond to the event (accept or reject the invitation)
  • see all members who are attending/not attending the event
  1. Tap on a Event Bubble on the Chat screen to see event details. An Event Modal will pop up, showing all details of the event, including the Attending and Not Attending list of members.
  2. You can respond to the event by pressing the 'Accept' or 'Reject' buttons on the modal. Once you do, you can see your username under the respective lists.

3.6 Calendar

The Personal Calendar shows all the events that the user has accepted to attend. One can acces the Personal Calendar screen by pressing the Calendar icon at the bottom tab navigator. Here, you can see all events that the user has accepted. By tapping on these events, the same Event Modal will pop up to show all details of the event.

3.7 Polls

The user can also now create a simple poll in each group chat. Each poll has question component and options component.

To create a poll:

  1. Tap the '+' button at the bottom left hand corner of the screen from the Chat Screen. Tap on the poll icon. You will be navigated to a new screen to create the event.
  2. Here, you can add the question of the poll (required)and a number of options for the poll.
  3. Tap the 'Publish' button below to publish the poll to the group. You will be navigated to the Chat screen.

Once created, you are able to

  • see all the information of the poll
  • tap on any number of poll options
  • see all members who have selected an option
  1. Tap on a Poll Bubble on the Chat screen to see poll details. A Poll Modal will pop up, showing all details of the poll, including the options and the number of people who have selected the options.
  2. You can respond to the poll tapping on the checkbox beside each option. The number will update immediately.

3.8 Dark Mode

Dark mode is a feature that has become really popular recently, with the announcement of dark mode in iOS 13. We intend to support the trend of dark mode by implementing it into our application on an application-wide level.

Dark mode helps the user through better readability of text and reduced eye fatigue, and will therefore be a very welcome feature in any application. We intend to implement this using our application-level state management library, Redux.