ajuogaaz/devhub

I a social website that connects devs to other developers

Original App Design Project - README Template

#Week 2 walk through.

• 

DEVHUB

Table of Contents

1. Overview
2. Product Spec
3. Wireframes
4. Schema

Overview

Description

This is a social networking app that connects different developers and help them keep touch with different trending open source communities in github and whatever they are interested in.

App Evaluation

[Evaluation of your app across the following attributes]

• Category: Social Networking
• Mobile: Android with a mobile first experience
• Story: Allows users to share whatever they are working developing and also keep touch with what people in their network are developing
• Market: Any person interested in seeing what different software and developments are being made. Ability to follow other developers and see their posts and get updates on the latest developments
• Habit: Users can post throughout the day many times. Users can scroll through endless post of from other developers and see what they are working on and also get ideas on what tools are getting popular with the developers field.
• Scope: Everyone above

Product Spec

1. User Stories (Required and Optional)

Required Must-have Stories

1. SignUp Requirement Issue #6 Status: Closed
   • Users are able to sign up new accounts in the register activity
2. Login and Logout Requirement Issue #6 Status: Closed
   • User is able to login through the login activity and logout of the app
3. Database Requirement Issue #1 Status: Closed
   • The app is configured with the Parse nosql database hosted in heroku
   • User can compose a post that is posted to the tiomeline after being saved on the parse database
4. Camera Requirement Issue #18 Status: Closed
   • Users are able to use the camera to take a picture and set their profile picture using it
5. Sdk Requirement Issue #19 Status: Closed
   • Users are required Auth their github accounts to access full functionality.
6. MultipleViews Issue #3 Status: Closed
   • User lands on the home fragment where they see the floating compose icon for compose activity.
   • User can switch to the repo fragment where they’ll be able to see all their repositories in a recycleview
7. Gesture Recognizer Requirement Issue #13 Status: Open
   • User can double tap the like icon to like a post
8. Complex Algorithm Requirement. Issue #11 Status: Open
   • In the timeline View user will see posts ranked.
9. Incoporated External Library for polish. Issue #20 Status: Closed
   • Use glide an external library to load Images.
   • Add the External material Design Libraries.
10. Animation Requirements Issue #12 Status: Open
    • Add an animation to the profile activity changing the toolbar.

Optional Nice-to-have Stories

• Users can be able to send messages
• User can be able to comment and view posts
• User can be able to see number of post they have.
• User can see number opf followers and following they have
• Users can see previous posts below their profile and scroll through them
• Users will be able to see additional information on each repository such as number of stars, downloads, and forks

2. Screen Archetypes

• Signup Screen
  • Users are able to sign up new accounts in the register activity
  • Users are required Auth their github accounts to access full functionality.
• Login Activity
  • User is able to login through the login activity and logout of the app
• Timeline Activity
  • User lands on the home fragment where they see the floating compose icon for compose activity.
  • User can double tap the like icon to like an app
  • User will see posts ranked in order of the latest factoring in who they follow and popular posts with more likes.
• Compose Activity
  • User can compose a post that is posted to the tiomeline after being saved on the parse database
• Profile Activity
  • Users are able to use the camera to take a picture and set their profile picture using it
  • Use glide an external library to shape the image for user to be circular.
• repo Activity
  • User can switch to the repo fragment where they’ll be able to see all their repositories in a recycleview

3. Navigation

Tab Navigation (Tab to Screen)

• Interact with posts in timeline
• Profile
• Repositories

optional

• Messages
• Search
• Settings

Flow Navigation (Screen to Screen)

• Sign Up screen the authenticate Github
• Login screen then auth github
• Profile -> Texts and posts
• Timeline -> Posts
• Compose -> Create new posts

Wireframes

These are the pictures of the hand drawn wireframes with the core functionalities potrayed in though UI.

Digital Wireframes & Mockups

click here to view a digital wire frame

Interactive Prototype

click here to view an interactive prototype in framer. It is fully equiped inside a virtual mobile frame and you get a simulation of how the app will exactly work.

Or watch this short summary.

Schema

Models

Post model

property	Type.	Description
User	Pointer to user	image and username of author
objectId	String	Unique Id for the user post
Title	String	the title of the post with format user and the github repository
body	String	The body say by the author
commentsCount	Number	number of comments
likesCount	Number	number of likes
createdAT	DateTime	Date when a post was created
updatedAt	DateTime	date when post was last updated
objectId	String	Unique Id for the user post

User Model

Column 1	Column 2	Column 3
createdAT	DateTime	Date when a post was created
updatedAt	DateTime	date when post was last updated
objectId	String	Unique Id for the user post
FollowersCount	Number	number of followers
FollowingCount	Number	number of following
githubUser name	String	username of user
UserProfile pic	File	image of user
User Number of repository	Number	number of github repositories

Networking

• Profile Activity

  • (Read/GET) Query all post where user is author
  • (Read/Get) Query user information such as folowers and following
  • (Update/PUT) Add a profile pic

• Compose Activity

  • (Create/PUT) Create a new post

• Timeline Activity

  • (Read/GET) Query all posts where user is author
  • (Create/POST) Create a new like on a post
  • (Create/POST) Create a new comment on a post

• Repo Activity

  • (Read/GET) Get a list of all repositories

#Week 2 walk through.

• 

#Week 1 walk through.

• 

devhub's Issues

Polish Home Activity

1. Design Logistics

   • Determine and structure the position of a post supporting tools
   • Enable user to click to view the details activity with the post

2. Compose Activity.

   • Add compose Activity floating button in the homepage

Gestures

• Add doubleTap to the post in the details Activity to like
• Stretch Goal Add swipe in profile Activity to go back to main activity

Search Fragment

• Add an algorithm to determine what suggestions to give the user a job recommendation depending on their level of experience as determined by the information provided at onboarding and the github repository contribution.

Animations

• Add an Animation from the home
  Fragment to the details fragments
• Add an Animation from the details fragment to the comments fragment

Details Activity

1. Add Proper feature View
   • User is able to see the full post
   • User is able to see comments and read through the comments

Integrate the SDK and make network calls

1. Build and test auth
   • Build and complete the login and auth
   • Integrate github sdk for user access
   • Build sign up system and create users

Third party repositories

• Enable user to view other users repositories

• Enable user to click on other user repositories to go to their github pages and learn more

• Enable user to access other user github work from the github repo page

Add third party user view

• Enable user to click and view third party users and be able to view their profile and their posts and give them the options
  to follow or unfollow
• Enable users to click anywhere they see another user to immediately view their page

Camera to upload pictures

1. Add Camera Functionality
   • Connect Camera to the onpress user profile picture
   • Enable user to take pictures and pick also from the gallery
   • Upload the picture to the parse server and Byride their picture from github

Search View

Populate the search fragment to enable users search for other user

Build out skeleton Views of the app

1. Build and test the major views in the app
   • Build the Main Activity with Timeline, Profile, Repo and Compose Fragments.
   • Connect the Timeline Fragment to the Timeline Adapter and to display post
   • Connect the Profile Adapter to the profile fragment to display post
   • Build basic Repo page

Onboarding

• Created onboarding screens

• Added information like location to use in later movement

Set up models and thoroughly test them

1. Set up models and validate they work
   • Build user class
   • Build Post class
   • Build likes class
   • Build and define followers class
   • Build Comments class

UI polish

• Bring in an external library to make the UI look fancier (Added the CardView library and the Material Library to style buttons and make beautiful cardview and toolbars)

Login and Logout

1. Establish the correct account creation flow

   • Build a separate login and sign Up activity
   • Save Token in parse server to prevent login every single time.
   • User that has logged in before bypasses the login the next time they come in
   • Add logout within the Settings
   • Test the functionality thoroughly

Stretch Feature - Followers Module

• Add the concept of followers with an additional class in parse
• Add the follow button in the android app to enable users follow each other
• Enable users to view their followers through a bottom collapsing view
• Enable users to view the people they are following

FollowersAndFollowingDisplay

• Add a Tab layout to display followers and following side by side

• Import the followers from the Following module

• Display the user followers in a list and following in another list beside the followers

Import the external Material Design Library for a polished UI

1. Layout styling
   • Bring in the the material library to polish the look of the single post item
   • Add the like buttons and comments button and other stuff that will be used
   • Add the android theme to make it very polished

Chat Feature - Stretch Feature

• Enable users to text other users

• Add layout for previewing texts

• Add model for messages

• Enable searching for a user to see what text to send

Configure parse server

1. Set up parse server
   • Deploy to Heroku and test server connection
   • Set up parse dashboard

Polish Profile Activity

1. User Information fill up process
   • Fill Up user information from the Sign up page from their github profile
   • Add edit user profile section to enable user to edit their profile to override github information

Compose Activity

1. Add Camera Functionality

   • Connect Camera to the onpress user can take pictures
   • Enable user to take pictures and pick also from the gallery

2. Make different layouts

   • Make creating a post a multiactivity task where you first add description and Topic then image