LMS & Social Networking

Initial document of understanding-Phase 1

6/28/2012

LMS & Social Networking Revision History

Date 28-June-2012 2-July-2012

Version 1.0 1.1

Description Document of Understanding _Phase 1 Revised Submission_Phase 1 (Incorporated client inputs)

Author Seasia Seasia

Page 2

LMS & Social Networking

Contents
1. Home ................................................................................................................................................................................................ 4 1.1. 1.2. 1.3. 2. Sign up .................................................................................................................................................................................... 5 Login ....................................................................................................................................................................................... 6 Forgot Password ..................................................................................................................................................................... 7

Profile Creation ............................................................................................................................................................................... 8 2.1. 2.2. 2.3. 2.4. Login Details............................................................................................................................................................................ 8 Educational Details................................................................................................................................................................ 10 Professional Details............................................................................................................................................................... 11 Other Details ......................................................................................................................................................................... 12 About Me ................................................................................................................................................................................... 12 Skills and Expertise ................................................................................................................................................................. 13 Honors and Awards ................................................................................................................................................................. 14 Goals ......................................................................................................................................................................................... 15 Achievements ........................................................................................................................................................................... 15

2.4.1. 2.4.2. 2.4.3. 2.4.4. 2.4.5.

2.4.6 Interests ......................................................................................................................................................................................... 16 2.4.7. Hobbies ......................................................................................................................................................................................... 17 2.4.8. Photo ............................................................................................................................................................................................. 18 3. 4. 5. 6. 7. Main Profile ................................................................................................................................................................................... 19 User Home Page ........................................................................................................................................................................... 20 Contacts ........................................................................................................................................................................................ 22 Messages....................................................................................................................................................................................... 24 Notifications .................................................................................................................................................................................. 25

Page 3

LMS & Social Networking

1. Home
This is the Home Page of the portal. We have removed the registration box from the Home page. The middle section will have some informative text or highlights of the portal plus a Demo tour. The below section will have some blogs and footer. Please ignore the content and only look for the features. These will change later when you will provide us the real content to go on site. This screen will display portal's highlights and placements. http://klout.com/home - Something like this will look good? Please suggest. No registration on this page. May be just a link leading to contact page or for parents. Think how UI should be. But no need of a box for registration as its closed network. Not sure if we need all these info in home page as this is not a public network. Do suggest. I DO NOT WANT ANYONE TO COMMENT OR FEEL THAT OUR SITE LOOKS LIKE COPY OF FACEBOOK OR LINKEDIN IN STRUCTURE, CONTENT, ANYTHING. IT HAS TO BE UNIQUE. Login section should have more emphasis, not in a bar like that I think? Still this page is not as good as Klout. VJ said we will have UI experts who will suggest how things has to be? I do not want to be the one who decides this as I am not UI expert. Can I speak with UI/UX expert? Because this is very important part. Still my comments here: Since this is member only site, I thought the login page should be like klout. This is still different. Not sure if we will have ads now. Let me know.

Page 4

LMS & Social Networking

1.1.

Sign up

This is a Sign up screen. When an Institute will sign a contract with Admin offline, they will provide the Admin with student's DB along with personal email ids. Admin will send out the invites to all students and teachers of respective colleges. The link arrived in mails will have college name auto selected. Students and teachers will sign up themselves there. There might be colleges, not willing to give their students database so we can also give a link to college where students can register themselves. In this case, college itself be responsible to circulate this link among their students. Admin will manage the registration process for HRs. Admin will enter HRs name, email, contact and company details and send out an invite. HRs will go and sign up via the link arrived in mail to avail the benefits of the portal. Parents will be able to sign up on their own or their students can send them invite too. If they will sign up themselves, they would be asked to enter their student's name and institution name. Once verified, they will be registered and given the access. For students, we will also provide an option to send invites to their parents. This is something they can do at any point of time. Students will just need to enter the email id of their parents to invite them on the portal. There is no public registration. If general public will try to register by clicking on sign up, they will be sent to the Contact page. Only visitors those have arrived on the portal via the link received in their emails will be able to sign up on the portal. Can you refer to latest web 2.0 sites to see how their signup pages are? Query: Will this contact page be a simple page as on other sites where users can go and leave any post for the Admin? Ya, Contact page is simple. Fields may have an addition or so, but yes, simple form. Users will also be able to sign up with Facebook account. So is there multi step registration to get more details? Yes, as on http://klout.com/home, users can connect on this portal via Facebook. They will enter their Facebook credentials to sign up and start creating their profiles right away.
Page 5

LMS & Social Networking

1.2.

Login

This is a login screen which will allow users to direct Login on the portal or via Facebook account. I like the klout.com kind of login look than this. We need email based login in that page too which klout does not have, but that looks and feel is good. Dont worry about look and feel. This is designers job and before proceeding with other pages, they will get the Home page look approved from you. I am just not very sure about this part, because the home page here in social network is login page. Dash board is main inner page. We might have to see inner pages as well after login pages. I like login page l ike klout. Thats the quality I am looking at. May be login and home page is merged together. We dont need 2 separate pages? UI expert suggestion please.

Page 6

LMS & Social Networking

1.3.

Forgot Password

This screen will appear on clicking the "Forgot Password" from login screen. This screen will help in recovering the password. It will ask for the email id and once user is verified, a link will be sent on their personal mail id using which users can reset their passwords. Look and feel must change. All else okay. Same for all screenshots. When PSDs will arrive, you will find the change in look and feel.

Page 7

LMS & Social Networking

2. Profile Creation
Immediately after signing up, the process of profile creation will start. The wizards will be: Login General Educational Professional (This is only for teachers and parents) To Do List (We need to think these sections and form them) Login Details

2.1.

The first wizard will display Login details which can also be edited, if needed. On Login wizard, users will specify their roles. If users will check mark the "Parent option", they will be asked to enter Student name and Name of the institute. Once done, parents will successfully be given the access. There are totally 5 roles. Not 4. Do you want me to verify all fields now? Or is it something we will do later? Most of these fields like relation, guardian, in next image, language, nationality, etc are not needed. OK. As far we know, apart from these 4 there are two more roles: General public and Admin. We are told to consider general public later on and admin we cant show here. Kindly share the fields preferences you have. Fields is something that we have to work on when we move on to Programming as .NET. We will now focus on design and HTML. We will add/edit/delete fields later on before moving to .NET. If this is the parents signup, then its first institution name (which gives drop down as they type first letter) and same way for student name. They can only signup by selecting one in the drop down. They cannot enter. Why send invite to parents screen if this is signed up by parents? Send invite to parents by students is a place where they enter their parents email id and send invite, like invite friends. Even if that option is in signup, it has to then provide 2x2 fields where Name, Email is given for both mom and dad to fill. Need UI/UX suggestions please. To do list? Not sure on many parts here. Please ignore the Inbox screens. Tab on the following

Page 8

LMS & Social Networking

Page 9

LMS & Social Networking

2.2.

Educational Details

This screen will ask for educational details. The name of the college will come pre-filled based on the link. The one they enter here is CURRENT college details. So when they click add another, they wont have college name filled, but that wont be added to list of colleges too, unless its already there. Dates attended is calander box type filler. Grade??? Activities & Socities, Additional notes To be given thought.

Page 10

LMS & Social Networking

2.3.

Professional Details

This screen will ask for Professional details. The profile creation for teacher and parent will also Professional Details Tabs. These will be customizable so that admin may modify them if needed. Let me know if we should work on fields as well now. It is something you must research and suggest right? We will continue our research on it but would also appreciate your inputs on field names, if any specific. This wont come for student registeration. Only for parents. Needed for teacher & HR? To be decided. I think we will should focus on getting design out first. We can work on fields after that.

Page 11

LMS & Social Networking

2.4.

Other Details

On this screen, users will complete various profile options to bring their profiles on top. Each To Do List options on right will open a new panel on left prescribed area. But does this happen during signup process? 2.4.1. About Me

Page 12

LMS & Social Networking

2.4.2. Skills and Expertise

Page 13

LMS & Social Networking

2.4.3. Honors and Awards

Page 14

LMS & Social Networking

2.4.4. Goals

2.4.5. Achievements

Page 15

LMS & Social Networking

2.4.6 Interests

Page 16

LMS & Social Networking

2.4.7. Hobbies

Interests, hobbies, skills, etc should have suggestions, some list of pre loaded data like in linkedin/facebook to select from when they start to type We will brainstorm on other needed data as we go on.

Page 17

LMS & Social Networking

2.4.8. Photo

Page 18

LMS & Social Networking

3. Main Profile
This is the profile view of the details entered and this is how the profile will appear to others. Users can edit any information on this anytime. Profile Tab will have following options in drop list: (I dont want this option. May be a button in profile page called EDIT which on click goes colorful and page can be edited and when clicked again goes grey and it is view mode. I just do not want a 2 sub menu for this like linkedin) View Profile Edit Profile

On the Top, we have preserved the space for AI. This will keep reminding users of the details they still need to fill to bring their profiles on top. Also update users on activities they need to revisit. On the right panel, they have given an option to upload their resumes for HRs to consider. Users could also select Post to Facebook wall option to share their profile on Facebook. Below that, users will see the % completeness of their profiles via a bar. We need Sync to corporate here. Thats like the bar only. Needs more thought from other references and sites. Under analysis.

Page 19

LMS & Social Networking

Upload Resume

Profile is very important page. I am NOT going to comment anything here. I need UI/UX designers to assit me in this.

4. User Home Page

This is the Home page of the portal. Users will be able to upload anything on the arkeytect wall. On sharing, same would go on Facebook wall. This need settings/approval and disabiling option or TICK option like hootsuit. I tried to look for this feature on hootsuit but I was not able to find any free trial. Hootsuit has free account. Please register. Or come to chat, I will guide. On Home page, users will see all updates from different users connected to the person logged in. They will be able to share, like, comment on the updates. There would be a section on right to display the companies on boom and the top jobs for users consideration. To be thought if needed or not. Pl let us know if thats needed. May be this is needed only for final year students. For other years, we can give them something else on this side. We have also defined a section for any kind of headline/news from Admin. All these pages are missing some modules which we spoke, like motivational quotes, etc. Please refer docs. These mock-ups only cover phase 1 features. Once approved, we will start with next phase, probably tomorrow onwards. The motivation quotes, etc are part of this page. Though its in different phase, it has to be part of this page. So try to make it up. I understand. Lets get all phases in to action, we need support of your UI/UX to get these sorted.

Page 20

LMS & Social Networking

Page 21

LMS & Social Networking

5. Contacts
This tab will have following options in drop list: All contacts (Shouldnt this page have option to remove/delete/unfriend contacts? Why separate page?) Add/Invite contacts (Lets refer to facebook and other networks. For this) Remove Contacts

This screen will display the contact list of the user. From this screen, users could also remove contacts from the list. Need to see better interface. Refer to fb and linkedin. This screen has been designed after referring Linkedin. You can refer to facebook and
http://klout.com/#/KarnikaYashwant/influencers/2 May be they give some idea. http://www.edmodo.com/home Refer to this for some UI part Not to copy, but how they have modified it to suit schools

https://plus.google.com/ - See new UI they have. Thye dont have any menus. All are compact based on item selection on sides. May be we have to come up with innovative world class UI which is very different from all others. I do not want a usual UI and menus. Facebook, Klout, Google+, they dont have it!!! Only linkedin has menu s. To be worked .

Page 22

LMS & Social Networking

5.1.

Invite contacts

This screen will allow users to invite friends and import users from existing ids. Its a closed network. Do we need invite via email? Please give some thought on each of those please. Like Linkedin, based on college we can search for students and add or open browse. Suggest.

5.2.

Remove contacts

This screen will allow to unfriend any connection. Merge it with main contacts page.

Page 23

LMS & Social Networking

6. Messages
This is the message center that will allow creating, sending and deleting messages. There is a separate section on right to display all invites separately. Ok, Lets review other sites to see how we can make it better. I thought as per our initial discussion, you will compare other sites and see problems users face on those sites and come up with a solution better than current.

Page 24

LMS & Social Networking

7. Notifications
This tab will show all new notifications received. See Facebook, klout, etc. They have it in a subtle icon/bar.

Page 25