Cover image for App Prototype

App Prototype

sroy8091 profile image Sumit Roy ・2 min read

From my last post about the app idea, I am writing this post about prototyping that idea about saving and sharing code snippet.

For prototyping I used proto.io, since it provides amazing features which will give you the exact functionality you want in your web app without writing a single line of code. You can build your prototype here and validate or take feedback from others about your idea. It is a great platform for building prototype.

Now, my web app concludes basically in 3 screens.

alt text

This is where the user is going to type in or paste their code and set the rules of discovering it by others.

alt text

This is for searching the codebase of our site to search the code snippets submitted by others. In future, there will be more filters to be added in search option like search by tags or by language. Clicking on the discovered snippets will send the user to the screen 1 but this time he can only see the code. The editing privileges will be given only to the user who submitted that snippet.

alt text

This is the user profile where he can see all the code snippets and the favorite ones and can edit the submitted code snippets. Clicking on the list of snippets will send him to the edit page i.e screen 1

You can see my prototype by clicking this link
And comment out your feedbacks here so that I can improve it.

In my next blog, I am going to post how to set up the local environment for making this prototype into a real web app serving developers like you. Meanwhile, you can check my other posts also.

Here is the index of all the post regarding this series of snipcode developemnt

Part I: App Idea
Part II: App prototype
Part III: Local Development
Part IV: G for Git
Part V: Data Modeling
Part VI: Data & Auth APIs
Part VII: Basic Functionalities
Part VIII: App Screen 1
Part IX: App Screen 2
Part X: App Screen 3
Part XI: User Reviews
Part X: Final Submission


Editor guide