You are on page 1of 24

Contents

Introduction: ................................................................................................................................................. 3
Modules: ....................................................................................................................................................... 3
Story .......................................................................................................................................................... 3
Resources blog .......................................................................................................................................... 4
Discussion forum....................................................................................................................................... 4
Ad bar ........................................................................................................................................................ 4
User registration: ...................................................................................................................................... 4
Log-in......................................................................................................................................................... 4
Forgot password ....................................................................................................................................... 4
User profile ............................................................................................................................................... 4
View Profile ............................................................................................................................................... 5
Chat ........................................................................................................................................................... 5
Miscellaneous ........................................................................................................................................... 5
User roles: ..................................................................................................................................................... 6
Visitor ........................................................................................................................................................ 6
Registered user ......................................................................................................................................... 6
Moderator (this is for future use) ............................................................................................................. 6
Admin ........................................................................................................................................................ 6
Website layout: ............................................................................................................................................. 6
Home Page ................................................................................................................................................ 8
Header 1 ................................................................................................................................................ 9
1. Logo ............................................................................................................................................... 9
2. Submit your story – this has 2 versions depending on whether the user is logged in or not ...... 9
3. Resources .................................................................................................................................... 13
4. Discussions .................................................................................................................................. 14
5. Search.......................................................................................................................................... 17
6. Log-In........................................................................................................................................... 17
7. Sign-Up/ Join Now....................................................................................................................... 18
Header 2 .............................................................................................................................................. 20
Story box ................................................................................................................................................. 20
Story detail page ................................................................................................................................. 21
Ad Bar ...................................................................................................................................................... 22
Footer ...................................................................................................................................................... 22
Home page for logged in user ................................................................................................................. 23
My profile ................................................................................................................................................ 23
Profile view ............................................................................................................................................. 23
Chat list ................................................................................................................................................... 23
About us .................................................................................................................................................. 23
Contact us ............................................................................................................................................... 23
Terms and conditions.............................................................................................................................. 23
Open items .................................................................................................................................................. 24
Project phases ............................................................................................................................................. 24
Introduction:
A short story portal for everyday writers to contribute short stories. Writers can register on the portal to
submit stories or they can also submit anonymously without registering. Registered writers can connect
with each other, chat, and comment on each others work.

Modules:
Following are the main modules of project:

Story
This is the core feature of site. A writer can submit story.

1. Submit a story
a. A user can register on our portal to submit story. A registered user can also submit story
anonymously.
b. Non Registered users can submit stories either anonymously or by giving their name.
2. Story format
a. Since this is a short story portal, story length will be restricted to (250~400 characters),
(need to decide this based on how much space characters will occupy and based on font
style)
b. Each story will be submitted under a particular genre
c. Writer will select a background from pre-defined set of background for his story, a font
style and font color
d. Story will be sent for moderation after submission
3. Story moderation
a. Story will be moderated only for inappropriate/ offensive content. Story will be
published regardless of its quality.
4. Publish story
a. Post approval story will be published on the portal
b. Story will be published as an image, on the background selected by user, and in the font
style and color selected by user.
c. This image will be downloadable and carry authors name along with story content
5. Activities on story
a. Story like/dislike: story can be upvoted/ downvoted by other users. Any site visitor can
upvote/downvote story. No need for logging in or registration.
b. Story rating : story can be rated on a scale of 1-5 stars by other users. Any site visitor can
upvote/downvote story. No need for logging in or registration.
c. Story emoticon: user can select an emoticon as his reaction to the story, like funny, sad,
angry, etc. Any site visitor can upvote/downvote story. No need for logging in or
registration.
d. Comment – to comment on a story a user need to be a registered used and logged in.
comments cannot be posted anonymously. Comments will also be moderated (prefer
auto moderation here which filters out offensive strings)
6. Genres of stories
a. Each genre will have its own page, which will display stories assigned to it
b. On home page all stories will be displayed according to time stamp, from all categories

7. Most rated stories


a. This will feature most rated stories by user (need to think of quantity vs quality)
8. Most commented stories
9. Most liked stories

Resources blog
1. This section is for admin use only
2. This will be a blog managed only by admins
3. Admin can post a text entry, video, image or document on it
4. Anyone can like/dislike a post
5. Only registered users can comment
6. Images, docs used in blog should be downloadable

Discussion forum
1. This is like a discussion forum, for both admins and registered users
2. This will be like resources section (can explore ideas for this)
3. Both admin and registered can start a discussion
4. A logged in user can participate in a discussion

Ad bar
1. This is a sidebar which will have small windows (5-7) to show ads

User registration:
1. A user can register through social media or by creating an account on our site
2. When a user creates account on our side, username check will be done
3. Password should be strong and follow general rules (character, numeral, uppercase, etc.)
4. A user can register only one account from email id
5. Account will be activated post email verification
6. After the user is registered he will be sent a welcome email, and he can perform all registered
user activities
7. Need to understand how we will provide security to accounts created on our site
8. When user sign-ups using social media account directly, an account will be created on our end
too. (how do we create this account, I don’t know how this works)

Log-in
1. User can log in through social media or account created on our site
2. User will get 3 attempts to successfully log-in post which his account will be disabled for a day
3. On unsuccessful attempt, user will get appropriate message
4. After log-in authentication, user will stay on the page from where he clicked log-in

Forgot password
1. If a user forgets his password he will click on Forgot password screen
2. After providing username or email ID, an email for password reset will be sent to his email ID
3. Following the link on email user can reset his password
4. How does this work for social media?

User profile
1. After user completes registration he will be directed to a detailed profiles page
2. We will captures users information here (information to be captured is to be decided ,TBD)
3. User will be see his friend list
4. User will see who he is following
5. User will see notifications for his post – activity on his story
6. User will get notified when his friends or whom he follows post a story or start a discussion
7. User will see notification for unread messages – there will be 2 categories friends and others
8. User can see who is following him
9. He will have some control over his account settings, like mail notifications, (need to think more)
10. He can add his social media friends (when he enters social media credentials, his contacts will be
sent an invite)
11. He can find friends using some criteria, like genre
12. User can edit his profile anytime
13. User should not be able to add any offensive content/ image to his profile
14. Any other suggestions

View Profile
1. A user can view profile of other users
2. He can view users friends, followers (unless hidden by users account setting)
3. It will have an option to add or follow this user
4. It will have an option to message him
5. A user profile can be reported for abuse if the user manages to upload offensive content/ image
6. It will also have a ‘block’ option, a user can block another user

Chat
1. A user can chat with any other user
2. He will see the status of his online friends in the friends list window that would pop up on right
hand corner after he logs in
3. When offline messages are sent, the user to whom messages are sent will be notified in
messages tab of profile
4. Chat history will be saved, until deleted by user
5. A user can block another user on chat, this will only block the chat and not the whole profile
6. A non logged user can only chat with admin – leave messages which will be responded as and
when admin is available (can think of AI for FAQ’s like in most sites later)
7. When a user logs in a users friend list showing their online status will pop up on right hand
corner
8. A user can report another user for offensive chat
9. Any questions, suggestions?

Miscellaneous
1. About us
2. Contact us form
3. Terms and conditions (while signing up)
User roles:
Visitor
1. A visitor can perform activities like upvote/downvote/rate/emoticon
2. He can submit a story
3. He cannot comment

Registered user
1. Any user can register on our site to write his story
2. A registered user will have his profile page. This page will capture his information and bio.
3. He can view profile of other writers.
4. He can add or follow other writers. Writers who add each other will become friends.
5. He can chat with other writers. All his friend will show up in a chat list, he can send messages to
non-friends writers also.
6. He can block a writer, or report him in case of any offensive/inappropriate activity.

Moderator (this is for future use)


1. A moderator is a role that can approve stories, but not perform any other administration task
2. A moderator cannot approve stories submitted by himself
3. A writer can apply for moderator role after publishing 50+ stories on site

Admin
1. Admin rights will be given to selected core team members
2. Admins main responsibility would be to approve stories
3. He can block users/ remove stories/ or send warning messages

Website layout:
This layout is prepared from our research. We would like to get recommendations/ suggestions on
Layout. All the functionality should work as given.

This website has following pages:

1. Home page
2. Submit your story
a. Logged in user
b. User not logged in
3. Resources
a. Landing page
b. Detail page
4. Discussions
a. Landing page
b. Detail page
c. Start a new discussion
5. Search Page
6. Log in Page
a. Social media login page
7. Password reset
8. Sign up
a. Social media
b. Create account
9. Page for each genre
a. Love
b. Fantasy
c. Sad
d. Horror
e. Thriller
f. Motivational
g. Miscellaneous
10. Story detail page
11. Most liked stories page
12. Most commented stories page
13. Most rated stories page
14. Home page (after user logs in)
15. My profile pages
a. Profile View
b. Notifications
c. Message
d. Activity
e. Friends
f. Settings
16. About us
17. Contact us form
18. Terms and conditions (for signing up)
Home Page
Home page has following elements:

Header 1 – this will remain fixed throughout the site. It will be there on all pages. It has following
sections:

1. Logo – we have a design in mind, but this is not final.


2. Submit your story – this has 2 versions depending on whether the user is logged in or not
2.1 User is logged in to the system
Clicking on ‘submit your story’ will take user to the submit your story page
Step1: submit story

Story title is an optional field.

Content will be limited to 250~400 characters. Text should be checked for typos.

User will select a background for his story from pre defined list of backgrounds.

User will select the font color he wants on background and font style. Font size will be fixed by us.

User can chose to submit his story anonymously.

After user clicks on Submit, his story will be sent for moderation

Step 2:

A ‘Thank you’ screen will pop up after the user clicks on submit. It will have the a message like this:

Thank you for submitting your story. Your story has been sent
for moderation. Your story will be published post approval. A
notification will be sent to you once your story is published.

(We only dismiss offensive/ inappropriate/ religiously


controversial content )

OK!

Step 3: After clicking on ‘OK!’ user will be redirected to home page

Step 4: Post moderation

If the story gets approved, users story will be published as an image, in his chose background,
font color and font style. He will be notified of the same on the portal notifications and via email

If the story gets dismissed, user will be notified of the same via portal and mail.

The story will be viewable on home screen like this:


If the user has chosen to submit anonymously <author name> will be ‘anonymous’

Story can be shared by other users on social media or downloaded (image will be shared/ downloaded)

Viewers can upvote and downvote story, rate, select emoticon or comment (if logged in).

2.2 User is not logged into the system


This will take user to second version of submit your story page.

Header1, header2, Ad bar and footer will remain same as in above step. (only
difference is that instead of My Profile, Log IN button will be there in header 1)

Step1:

Here since user is not logged in, he may provide his name and/or email ID while submitting story.
Everything else will remain same as in above step. After user clicks on Submit, his story will be sent for
moderation

Step 2:

A ‘Thank you’ screen will pop up after the user clicks on submit. It will have a message like this:
Thank you for submitting your story. Your story has been sent
for moderation. Your story will be published post approval. If
you have provided email ID a notification will be sent to you
once your story is published.

(We only dismiss offensive/ inappropriate/ religiously


controversial content )

OK!

Step 3: After clicking on ‘OK!’ user will be redirected to home page

Step 4: Post moderation

If the story gets approved, users story will be published as an image, in his chose background,
font color and font style. He will be notified of the same via email (if provided)

If the story gets dismissed, user will be notified of the same mail (if provided)

<author name> will be ‘name submitted’ by user, if no name given then ‘anonymous’ will be
published
3. Resources
Clicking on resources will take user to Resources Landing page.

3.1 Resources landing page


This will contain blogs added by admin. Users can comment, like the blog.

Header1, header2, ad bar and footer will remain same. Content area will change as follows:

Clicking on a particular blog will take to resource detail page.

3.2 Resource detail page


This page will show entire blog content along with its comment trail. It will show ‘Prev’ and
‘Next’ buttons to navigate to other blogs.
Clicking on add comment will take a logged in user to comment box. For a non logged in user,
log-in screen will open.
As above, header1, header2, Ad bar and footer will remain same. Content area will change as
follows:
4. Discussions
This is same as resources except that discussion can be started both by admin and users.

4.1 Discussion Landing Page


Since discussion can be started any user, the only difference is that it will have a ‘Start a
discussion’ button.
4.2 Discussion detail page
This page will show entire discussion content along with its comment trail. It will show ‘Prev’
and ‘Next’ buttons to navigate to other discussions.
Clicking on add comment will take a logged in user to comment box. For a non logged in user,
log-in screen will open.
As above, header1, header2, Ad bar and footer will remain same. Content area will change as
follows:
4.3 Start a discussion
Discussion can be started either by admin or by logged in user. Discussion cannot be started
anonymously.
Clicking on start a discussion, will take to ‘start a discussion’ page.

Step1:
As above, header1, header2, Ad bar and footer will remain same. Content area will change
as follows:

Step2: User will get a ‘Thank You’ pop up screen

Thank you for starting a discussion. Your discussion will be


published post moderation. A notification will be sent to you
once the discussion is published.

(We only dismiss offensive/ inappropriate/ religiously


controversial content )

OK!

Step 3: After clicking on ‘OK’ user will be redirected to ‘Discussions Landing Page’

Step 4: Post moderation discussion will get published/ dismissed. User will appropriate
notification via portal and email. Whenever any activity happens on the discussion, user will
be notified.
5. Search

User will type in search and get suggestions. Search will happen across stories, resources and
discussions.

After user click on search icon or on a ‘suggested search’ he will be redirected to ‘search results landing
page’.

All relevant search results will be displayed here, 10-15 at a time with pagination.

Clicking on a search result will take the user to that particular items details page.

6. Log-In
Log In button/label will have a downward arrow button next to it like this:

Clicking on Log in button will open a small screen on the page from where Log In is clicked. Eg; if it is
done from home page, a screen like this will open at right hand corner (this is one suggestion picked
from some site):

New to writers community?

JOIN NOW
6.1 Social media login

Clicking on FB, Twitter, ?? (may be insta) will take to window (social media login screen) to enter social
media credentials like FB credentials. If FB is logged in via same browser it should pull that details and
give a continuation screen (This is the case in most websites). Same for Twitter & Insta.

For new user

When a new user uses his credentials, his account will be created (I am nots ure how this works, need
inputs on it) and he will be logged in and remain on page he clicked Log IN from. A welcome mail will be
sent to him.

For existing users

(How do we differentiate between a new/existing user who logs in directly from social media? We cant
store social media credentials, so how does this work?)

User will be logged in and remain on page from which he clicked Log IN.

Incorrect credentials

Appropriate message will be displayed on ‘Social Media Login’ screen.

6.2 Login via Username & Password

This is for users who have explicitly (w/o social media credentials) created an account on our site.

1. User will enter ID – Password


2. User will get authenticated .

Correct Incorrect
User will get logged in and remain on Appropriate message will be displayed
same page in the site from where he on login window, window will remain
clicked Log In. open and user will continue to remain
on same page from which he clicked

on Log In. User will 3 attempts to


successfully Log-In, post which his
account will be deactivated for 24 hours
and an email sent to him

7. Sign-Up/ Join Now


Clicking on ‘Join Now’ from ‘Log In’ screen will take the user to ‘Sign Up’ page.

This will 2 options:

1. Sign up from social media


2. Create an account on our site
Header1, header2, Ad bar, and footer will remain same.

Content are will be as follows (this is one example):

CHECK BOX - Agree to terms and conditions (mandatory)

CHECK BOX - Agree for news and updates (optional)

CHECK BOX - Agree for promotional content (optional)

SIGN UP

7.1 Social media sign up

Step1: Clicking on ‘Sign up through X’ will take user to a window to enter social media
credentials (just like Log-in)

1. After validating credentials an account will be created (how will we create an account for a
person who directly uses social media credentials?) and welcome mail sent.

On failure an appropriate message will be displayed on social media sign up window itself.

2. After sign up is done, user will be directed to Create your profile page. Here we will captures
users information. He will have an option to skip this step.
3. After user creates/skips his profile, he will be redirected to the page from where he started
the sign-up process. Eg; he started the signup process to add comment on a story, the he
should be taken back to that story page
7.2 Sign up by creating account

1. User will enter his details on Sign-up page and click on Sign up
2. A verification mail will be sent to user’s email ID. Until the verification doesn’t happen, his
account will not be activated.
3. A ‘Verification mail sent’ window will open and ask him to verify his account.
4. When the user will verify his account via link sent on mail, his account will be activated
5. In the browser window, he will be taken to ‘create your profile page’
6. After user creates/ skips his profile, he will be redirected to home page
7. A welcome mail will be sent to him

Header 2
Header 2 has ‘genres’ of stories called categories. 5-6 categories will be displayed.

First icon will be a home symbol, which will display stories from all categories. This is default
selection.

Rest each category will have its own page, where all stories from that category will be displayed.
Clicking on a category will take the user to that categories landing page.

Story box
This is as seen on home page. (this box will repeat itself about 10 times, the screen will be scrollable,
after about 10 stories footer will come )

1. Story title is optional – displayed if given by user


2. Story content – text entered by user while submission
3. Author name – writers name as entered while creating profile

Elements 1-3 will be in an image


4. Submitted by: Authors name, time and date of submission/approval (undecided). Here author’s
name will be clickable. Clicking on authors name will take the user to his profile page.
5. Upvote: clicking on this will increase count of upvote by 1. Current number of upvotes should be
displayed. Once upvoted a user cannot upvote the story again.
6. Downvote: clicking on this will increase count of upvote by 1. Current number of upvotes should
be displayed. Once downvoted a user cannot downvote the story again.
7. Rating: user can rate the story on a scale of 1-5 stars. Current average rating will be displayed.
When user hovers over stars, rating will disappear and he will be able to select as many stars as
he wants. Post clicking on stars, average rating will be shown again. Once rated a user cannot
rate the story again.
8. Number of comments: this box will display current number of comments on story. Clicking on
this will take the user to story details page, where entire comment trail will be displayed.
9. Emoticons: user can select the emotion he felt while reading the story from a set of given
emoticons like angry, sad, funny. Each emoticon will show its own count.

10. Social sharing icons: any user can share the story (image) on social media. We should keep a
track of number of shares for our internal use.
11. Download Icon: Any user can download the story (image) on his system. We should keep a track
of number of downloads for our internal use.

Story detail page


Clicking on a story will take the user to ‘Story detail page’. Category to which the story belongs
will be highlighted in header 2. Rest Header1, header2, Ad bar, and footer will remain same.
It will show ‘Prev’ and ‘Next’ buttons to navigate to other stories.
Clicking on add comment will take a logged in user to comment box. For a non logged in user,
log-in screen will open.
Content area will be as follows:
Ad Bar
Ad bar will have multiple small boxes (5-7)

Three of the boxes will be for our site:

1. Most rated stories – this box will feature most rated stories. Clicking on it will take the user to
‘most rated stories’ landing page which will display most rated stories from all categories.
2. Most commented stories - this box will feature most commented stories. Clicking on it will take
the user to ‘most commented stories’ landing page which will display most commented stories
from all categories.
3. Most liked stories - this box will feature most liked stories. Clicking on it will take the user to
‘most liked stories’ landing page which will display most liked stories from all categories.

Rest of the boxes will be for ad’s as and when we get.

Footer
This is largely undecided. It will have links to pages like about us, contact us

Need to think on this, ideas are welcome.


Home page for logged in user
When a user logs in to the system, then the log-in button at right hand corner will change to ‘My Profile’

Also, a window will be displayed at right hand corner showing friend list for chat (like FB)

My profile
(This is also bit of grey area, we need ideas on this)

For now we have thought of following options:

When the user click on my profile a window will open up with options as follows:

1. My profile (this will take the user to his profile page)


2. Notifications: this will have number of new notifications. Clicking on this will take the user to
notifications page. User will be notified for any activity on his stories and discussions. User will
also get notified if his friend or whom he follows adds a story or starts a discussion
3. Messages: this will have number of people who messaged him while he was offline. Clicking on
this will take the user to messages page (like FB) where he will be able to see his messages with
other users (both friends and others)
4. Activity: this will take the user to his activity page. It will have all his activities listed (again like
FB)
5. Friends – this will take the user to a page which shows him all his friends and also followers
(again like FB)
6. Settings – this will take the user to his account settings page. User will have flexibility to change
some settings, like receiving email notifications (need to think more on this as well)

Profile view
This is how a user views the profile on another user. A user A will be able to see another users B
information that B has entered in profile info. He will be able to see the stories posted by user B and
discussions started by him. He can add user B as a friend or follow him. He can also send him a message.

Chat list
A user can chat with any user (unless blocked). This feature will also be same as FB

1. Display green icon next to online users


2. Clicking on a friend’s name will open his chat window
3. Chat messages will be saved, unless deleted by the user
4. If a friend is offline, user can still send him a message.

All chat features should be like FB.

About us

Contact us

Terms and conditions


Open items
Few items are open for brainstorming and suggestions:

1. Layout of story box


2. Layout of all pages – home, resource, discussion. Though we have provided a layout we would
like to explore any options suggested by designer
3. Color scheme – have not thought of one, would like suggestions
4. Adding new sections – In future we may want to add new sections, like authors corner. can we
ourselves do that?
5. Adding/ deleting/ editing genres – how to do that
6. Footer
7. Pages like about us, contact us
8. Profile pages – we have mentioned some of the profile pages, but we need more suggestions
9. Social media login/sign up – need to understand this, since we would not store social media
credentials how does a sign up differs form login?
10. Story length – 250~400 character (need to fix the length)
11. Comment moderation – we would not like to moderate each comment, some auto moderation
that checks for offensive string possible?
12. Profile content moderation – how do we ensure users don’t update offensive. Inappropriate
profile pic and data
13. Multilingual – we would like to support both English and hindi. Would like to consider regional
languages/ global languages support much later when we have users and bandwidth to hire
language specific moderators.
14. Mobile app – need to convert this website to an app that can be downloaded form google and
apple stor.

Project phases
Project will be divided in following phases

1. Requirement analysis – we would like to have brainstorming sessions with developers/


designers around features, functionality, and open items. Once closed, we would like a sign off
on the requirement doc
2. Solution design – we would like to understand how the solution will be designed
3. Development – timelines and our support required in this phase
4. Unit testing – what kind of testing will be done by developers
5. UAT – what kind of test cases will be prepared to mark the project as passed
6. GO live – put the project into production. We would like to understand this process, since we
may need to upload minor changes ourselves in future.
7. Maintenance- will any kind of maintenance be provided for minor enhancements or bugs that
we may found while using the site (since not everything can ever be covered in UAT)
8. Backup and recovery

You might also like