The dating app will share similarities to Instagram, Tinder , hot or not, and plenty of fish. Incorporate popular layouts that have been set as a flagship by these other brands. Whilst not copying these brands, a similar feel and user experience is vital, and they have pre-set the tone for social mobile user experience. The overview of this app is that it allows users to post pictures in order to accumulate a rating. Each picture receives an overall rating which is made up of numerous votes from various users. The amount of pictures and respective ratings are then aggregated to provide an average score for the user. The user can then message users who have the same score as them or below, and be restricted in messaging anyone above them. An upgrade feature will allow users to view exactly who scored them and how much they scored them.

App landing page:

The App’s landing page should be simple and similar to the tinder and Instagram app landing page as illustrated below.

Basic logo, with a short brief underneath, and then a prompt to log in or sign up or sign up with Facebook.

  • If the user clicks sign up then they should be prompted to ‘enter an email address OR Log in with Facebook or Instagram.
  • The sign up process must be as quick and as seamless as possible.
  • If they choose to sign up with fb or Instagram the app should extract as much information about them from their respective social media and log this on the back end of the system.
  • The next stage of sign up would be to choose a username and password, profile badge and a short bio restricted to 60 characters. Once this has been completed then their account is now open.
  • Once a user has signed up this should be logged on a back end spreadsheet. A log of name/ email / phone number, and as much information obtained from their social media as possible should be on this list.
  • If a user fails to fully complete the sign up, then a separate log of ‘incomplete sign ups ‘should also be logged on the back end.

Web Landing Page:

The web landing page should be as illustrated below and more of a promotion for the app than anything else.

After a users first ever sign up

  • Similar to the Tinder app, when a user first signs up, a small series of illustrations about how the app works should come up to briefly teach the user the concept. You will need to download the tinder app to see this, although I attach illustrations below.
  • The user swipes left to right, and on the last image they are prompted to click a let’s get started button (words to that effect)  , which brings them to the actual app.
  • As well as the user granting permission for the app to gain information from their social media , they should also grant permission for the app to determine their location.

App layout:

  • The app layout should be simple and incororate layout features used in popular apps i.e instagram / tinder.
  • Right at the top of the screen you will have the app logo, ( central ).
  • To the right of this you will have a message box , ( which will subsequently light up with a number in it according to how many messages are in the inbox at any given moment) . ( illustration below) . Its is imperative that the message must stand out .
  • To the left of the logo there should be a number which is the users current average score.
  • Right at the bottom of the app incorporate a similar layout to the Instagram app as illustrated below.
  • Each of these icons will subsequently take the user to the respective parts of the app.

Equivalent of the home screen ( far left icon).

  • This will take the user to the picture part of the app.
  • This is where they can see pictures posted (according to the criteria they have selected to view.
  • Pictures will display in order of latest post.
  • They will take up the majority of the screen and the user will choose a rating out of 10. Illustration below.
  • Instead of the like or not like buttons used by tinder our app will have a series of numbers 1-10.
  • These numbers should be large enough for the user to press them easily, but not too  overwhelming in comparison to the size of the picture, the picture should take prominence.
    • Just above the picture the user’s icon badge and name should be displayed as illustrated below.
    • There should also be an indication of how long ago they posted that picture ( similar to Instagram) .

There should also be the user’s average rating by their name.

  • Just below the picture there should be a ‘this picture has received 67 votes and has an average rating of 7.2’ ( for example )
    • Once a user has rated the picture, then the next (latest) picture from another user appears.

    IF a user clicks on the users profile badge or screen name, they are then taken to that specific users profile where they can see all the pictures posted from that given user, again similar to Instagram.

    • Here they can open the picture they want and rate it.
    • Once they have rated the picture within that users profile, another picture from that same users profile will appear ( ready to be rated), until the user comes out of the given profile and back to the main screen.

    Search feature:

    • Here the user will be able to narrow down their search criteria.
    • Once they have narrowed this down, the app will only show them users that are within those criteria.
    • On initial sign up (before the user has altered this criteria), a standard set of parameters should have been pre-set before they choose to change this. The search feature should look similar to this:
      • You will not need the I am ( male / female option ) as this would have been pre determined at sign up.
      • If they are a man, then the pre-set should be ‘show me women’.
      • In addition to the options, there should be a ‘rated ‘and then a scale of 1-10.
      • Allow for 1 decimal point i.e 1.3/1.4 etc etc .
      • Once a user has set this, and clicked search at the bottom this will then take them to the main part of the app where is shows them suitable users pictures. Whilst the app is searching for the users, an animation (similar to tinder ), would be nice . Illustration as follows:
      • A second part to the search feature should allow users to search for hashtags, illustration as below. If they are on the ‘people setting’ the screen is as shown above.
      • If they are on the hashtag setting, they type in a hashtag, and all relevant pictures will be shown.
      • Note once they close the app and re-launch it, their search settings should be as what they have specified for people, not the hashtag. The hashtag search should be a temporary feature.
        • More interested in the right part of this picture. Messages should appear bold i.e on this pof screenshot, they have a green ‘new’ near it, and this is similar to how ours should look. Its bold it’s clear and shows the user clearly that they have a new message. Once they open the message, the message feature should have a similar look and feel to whatsapp.
        • Users should have the option to block other users from messaging them,
        •  report a user .
        • Users should only be able to message users who are of the same rating or below. i.e if a user is a 7 they can message users 1-7.
        • If a user receives a message whilst they are offline i.e the app is closed, then they should receive a push notification to the phone. If they have switched this off, then they should receive an email to the associated email account advising them they have received a message.
        • If a user comes across another user who they are eligible to message i.e same score or below, then there will be a ‘send message button’ by the user’s profile.Post photo
          • Similarly to instagram this should be the centre button on the footer menu, and the most prominent.
          • Once they click this the user should be taken to the post photo page.
          • A short blurb should appear saying something along the lines of ‘ post something that depicts your looks or personality . etc etc.
          • They should then be prompted to choose or take a photo.
          • User should be given the option to choose from Facebook/ Instagram / library/ or take a picture and post it.
          • The aim at a later date is to do a deal with Instagram where they can share their Instagram picture with our app.. Please advise on the complexity of this.
          • The user can add hashtags to their picture when posting it. These form part of the search feature i.e people can search for the respective hashtags
          • Once the photo is posted this should go live.
          • On the back end however the photo should also be posted for an administrator to validate it. If the photo breaches the rules (naked photo ), or a photo of a celebrity for example then our administrator can simply remove it, and the poster will receive a notification that it has been removed.

          Notification centre:

          • This will be the icon to the right of the photo icon on the footer.
          • When a picture receives a rating then a notification will appear . Again very similar to instagram , illustration below.
          • Instagram shows notifications for likes, comments and follows. We will only show notifications for a rating ( i.e number of people that have rated / new rater etc ), and a score update. i.e update the user on their overall average score.
          • Other notifications may include messages that can be sent by an administrator or notifications that their photos have been removed etc.
          • Small favicons should be created for the respective notification
          • When a user clicks on his or her notification button it will take them to the notification screen. I have attached the instagram notification screen as ours will be similar.
          • It will show the user that gave them a vote but will not show what the user rated the picture unless they are an upgraded member. It will say something like :‘ john rated your picture’ – find out what he rated you . ‘
          • This will appear by the respective picture.
          • If they click on the users badge or name, they are taken to their profile page.
          • If they click on ‘find out the score’. They are taken to a page that prompts them to upgrade. Illustration as below.
          • Once the user clicks upgrade now, they will be taken to an option screen that gives them options. ( week / month / year or life time ) .
          • We need this to be an in app purchase via the apple store, and that an auto renewal is set dependant on the option they have chosen.

          An upgraded member:

          • Will be able to see who scored them and how much they scored them on each picture. Under their picture where they have the amount of ratings, they can click on that which will then break down names of the users that have rated them and the score.
          • Send a special request. This is a special request to a user higher than them to be allowed to message them. That user receives a notification and they can choose to accept or reject the request. If they reject it then they still can’t message them, if they accept it then they can message them even though they are a lower score than them.


          Profile section of the app:

          • Here a user will be able to view and edit their profile.
          • The main profile page will show them all their posted photos and there will be a link at the top of the profile saying ‘ edit my profile ‘ . In this part a user can , edit username / edit badge picture / edit small bio about themselves ( 60 characters ) , edit their contact information, change password.
          • Users can open, and delete any pictures of theirs that they no longer want up.  NOTE this will obviously affect their overall score.
          • There will also be a settings option underneath the ‘ edit profile link ‘  here a user can:
          • Turn on push notifications
          • Allow people ( X amount of ratings lower than me to contact me ) … the user can decide whether he or she lets people with a lower rating than them contact them. As a standard however only users with the same score or above can contact them.
          • Only allow users with my rating or above to see me – restricts who can even see them. As a standard this is OFF i.e everyone can see them.


          Messaging section:

          • When a new message is received there will be a prominent indication on the top right of the app within the message box as explained above.
          • When the user clicks on this message box they are taken to a screen that looks like this:

        The back end:

        • The back end should be able to virtually keep a log of, and edit everything that is going on within the system.
        • The administrator should receive notifications of ,
        • new user sign ups,
        • new posted pictures ( and be able to verify these ),
        • list of blocked users,
        • upgraded users.
        • The admin should also be able to access any profile ,
        •  edit it/ view messages etc etc.
        • The admin should be able to create users.
        • The admin should be able to message all users, (via the notification panel).
        • The admin can delete users, block users etc etc etc .

Dating Apps Video Tour: