Online media is anything but another term for us. Our everyday existence is deficient, or we can say we people make due on food, water, air, and web-based media. We are reliant so much that we will quite often share all of the data about ourselves via web-based media stages. Essentially, Android Studio is additionally not another term for an Android Developer. For amateurs, there is consistently an anomaly regarding how a complex application like Facebook, Instagram, Twitter, Linked In, and so on is created. How accomplish these applications work!! How do the preferences, remarks functionalities work in web-based media applications!! How does the informing usefulness function!! Also some more.
Table of Contents
How to Create-a-Social-Media-App-on-Android-Studio
In the past article “Most effective Way to Become Android Developer – A Complete Roadmap” we have examined that “The most effective way to learn Android is by fostering some essential tasks to some high level undertakings”. So in this article, we will foster something to that effect. We will foster a clone of an online media application.
Rundown of Functionalities
Information exchange themselves utilizing their email and secret key.
SignIn themselves utilizing their email and secret phrase that they have utilizing during the Signup interaction.
- Alter their profile information (Profile Pic, Name, and Password).
- Add different online journals.
- Look for a particular blog.
- Show every single enlisted client.
- Look for a client out of totally enrolled clients.
- Like a blog entry.
- Remark on a specific blog.
- Show all clients who preferred a specific blog.
- Erase a Blog Post
- Send Message
- Erase Sent Message
- LogOut themselves and log in with their other ID.
Use Case Diagram
Use Case graph is a piece of UML (Unified Modeling Language) that is utilized to portray the usefulness of a framework or a piece of a framework. They are generally used to outline the practical necessities of the framework and its communication with outer specialists (entertainers). A utilization case is fundamentally an outline addressing various situations where the framework can be utilized. A utilization case graph provides us with an undeniable level perspective on what the framework or a piece of the framework manages without delving into execution subtleties. The following is the utilization case chart for this undertaking:
Innovation Stack Used:
- For frontend: XML
- For backend: Java
- IDE: Android Studio
Information base Used: Firebase
An example video is given below to find out with regards to what we will do in this instructional exercise.
This instructional exercise has contained 16 sections as the accompanying:
Section 1: Splash Screen and Authentication Part
- Making a Splash Screen
- Validation Part:
- Enrollment, and
Section 2: Create Fragment Using Bottom Navigation
- We will Create Bottom Navigation with 5 Fragments (Home, Users, AddBlog, ChatList, Profile).
- On Home Fragment we will show every one of the additional web journals.
- In the UsersFragment, we will show every one of the Registered Users.
- In the AddBlogFragment We will add our sites.
- In the ChatlistFragment we will show a talk rundown of all clients with whom we have visit.
- In the ProfileFragment We will show the Profile of the client where we will show clients’ information and the online journals composed by the client.
Section 3: Edit Profile Data
- We will alter our profile information like evolving name, changing the secret word of the client, and changing profile pic.
- Changing secret phrase is a vital component since it might happen that occasionally somebody knows our secret key and all things considered, we really want to change our secret key.
- We change our profile pic utilizing choosing a picture from the exhibition or clicking a picture from the camera.
Section 4: Retrieve Profile Data
- We will recover information of clients From Firebase.
- This is a basic part where we will recover information of clients like name, email, and profile pic from ongoing Database and show that in text format and picture design.
- Later on, we are likewise going to show the websites of clients on the profile page.
Section 5: Add Blogs
- We will add websites by any client. Here we will work in AddBlogs Fragment where the client will add a blog with a title, portrayal, and a picture connected with that website.
- On the off chance that the client doesn’t compose any of the titles or portrayals then we will show a blunder.
Section 6: Retrieve Blog On Home Page
- We will recover the sites composed by clients on HomeFragment.
- Here we have just shown the client information and title, depiction, and picture of the web journals, however, we are additionally going to execute the like and remark include in impending websites.
- Then, at that point, We will show Post subtleties Activity where clients will actually want to remark.
- We have additionally executed the Like Blog usefulness.
Section 7: Search for a Specific Blog On Home Page and Logout Functionality
- We will Search For a Blog on Home Page.
- Assuming there are not many online journals in our application then it is not difficult to look for a blog physically. In any case, what happens when we have 1000 online journals then, at that point, look for a specific blog turned into an extremely confounded and time taking undertaking.
- That is the reason we are carrying out this component to look for a blog utilizing the title or portrayal gave.
- Likewise, we have executed the Logout usefulness in this article.
Section 8: Show All Registered Users
- We will Show every one of the Registered Users of our App.
- We will show the rundown of clients in UsersFragment.
Section 9: Search For a User Out of All Registered Users
- We will Search For a client on the Users Page.
- Assuming there are not many individuals enrolled in our application then it is not difficult to look for an individual.
- Be that as it may, what happens when we have 1000 clients enlisted in our application then, at that point, looking for a specific client turned into an extremely convoluted and time taking assignment.
- That is the reason we are executing this component to look for a client utilizing the name or email gave.
Section 10: Like a Blog Post
- We will Like a Blog. We are carrying out this element utilizing two pictures one like button with white foundation and one more like button with blue foundation.
- At the point when the client taps on the button interestingly we will change the picture to the button with the foundation shading blue and will build the count. At the point when the client clicks again then we will diminish the count and change the like button with foundation white.
Section 11: Comment on a Particular Blog
- We will remark on the blog.
- Here we will record a bit of feedback, and afterward we will show the remarks and will refresh the remark count.
- The remark highlight is the best component in any writing for a blog application. It helps in associating with the client who has composed the blog and substantially more.
Section 12: Show All Users Who Liked On a Particular Blog
- We will see the rundown of clients who have like a specific blog.
- Later Click on all out like we will be diverted to PostLikedBy.Activity.
- In that, we will utilize a recycler view to show the rundown of clients who have enjoyed a post.
We can likewise see the rundown of all clients who loves our post from the PostDetailActivity.class.
Section 13: Delete a Blog Post
- We will erase the Blog composed by the client.
- Websites must be erased by the proprietor of web journals. In the upper right of the blog, a button is there.
- In the wake of tapping on that a popup will come in that Delete button will come. In the wake of tapping on Delete, the blog will be effectively erased from the web journals.
Section 14: Create Layout and Send Message in Chat
- We will Create a Layout for talk and Send Messages in Chat.
- A client can send either a Message or an Image.
- A client can send a picture either utilizing a camera or display.
- First and foremost a solicitation for authorization will be approached to send a picture utilizing an exhibition or subsequent to tapping the picture utilizing the camera.
- Assuming consent is given then the client can send the picture or it will again demand for asking authorization.
Section 15: Delete Messages
- We will erase the message in the ChatActivity.
- We will erase message and picture messages. At the point when we click on a text then an AlertBox will come.
- There will be two choices to either erase that message or drop the occasion. Later Click on erase message will be erased from the two sides.
Section 16: Retrieve Blogs on User Profile
- We will Retrieve Blogs Written by clients on their profile piece.
- As beforehand we have as of now added Data of clients in Profile Fragment like email, name, and profile pic.
- Here we are additionally going to recover Blogs Written By the current client on their profile.
We should See the execution of showing the web journals composed by the current client.
Best Practices of Social Network Design
On the off chance that you have examined the market well and have every single essential material (a psyche map, utilitarian determination) to construct your own informal community then the initial step you will take with your advancement group is UX/UI plan.
To know how to make a web-based media application that will look and feel overall quite engaging, you ought to become familiar with some fundamental prerequisites to your future item as far as plan. Assuming that to be right these are suggestions dependent on some industry propensities, originators’ insight, and related explores.
These days, all online media applications should adhere to the accompanying basic principles:
- Rules of Social Media Design
- Utilize the shades of blue as this tone isn’t viewed as irritating
- Utilize a similar route bar with search capacities, notices, and profile symbol all through the application on each screen where they are required
- The plan of the whole application ought to be adjusted to a particular stage (there are plan rules for iOS and Android) for clients to feel open to utilizing the application on their gadget.
- Simultaneously your application configuration ought to share its vital elements for all intents and purpose on all stages. It is important to guarantee equivalent client experience and feel assuming a client changes iOS to Android or the other way around
- Smooth change from a web application plan to a versatile application plan to make client experience comparable on any gadget
- Round profile pictures help to zero in on a client’s face and simplify it to recollect them or recognize them from the rundown of others
- Endless look of posts
- Plan effortlessness and spotlight on client content
- Probability of self-articulation in plan (custom freedoms like changing a profile picture, cover picture, or even profile tones)
- Straightforward inquiry of clients and significant substance
- Fast sign in or application passage without joining on the principal stages to offer a chance for clients to discover more with regards to your item
- With everything taken into account, the nature of your informal community configuration will significantly rely upon an originator who will accomplish the work for you. In any case, the previously mentioned prescribed procedures will assist you with observing the fair compromise between what you will need your plan to be and what it ought to be.
A decent method for planning the primary (essential) variant of your custom application (online media applications included) is to definitely make plans for the full application form. It is important to check out your venture internationally, plan potential collaborations and set a right application engineering. When your advancement group sees the total picture, it turns out to be obvious to them how to make an online media application you demand. They conclude what highlights to leave for next variants and which of them can be carried out inside the first application rendition.