SlideShare a Scribd company logo
1 of 84
Download to read offline
Lemeno
iOS and Android Mobile App
Screen Flow
March 10, 2015
Lemeno iOS and Android Screen Flow
Updated design links 150210
Splash Screen Animation (150210):
https://www.dropbox.com/sh/huq6mjhveqphbfj/AABbBQPSxzwvm2BNULRG6Ehia?dl=0
Updated UI (150210 NH):
https://www.dropbox.com/sh/gmj6poq833my9ow/AACgJ2J2FrhPVWPDuPoTf5S0a?dl=0
Updated AI (LemenoMobileApp NH 150210.ai):
https://www.dropbox.com/s/3tpup7sfttflddk/LemenoMobileApp%20NH%20150210.ai?dl=0
Only buttons and tabs should have a tap effect (which by default will be 80% opacity of the inactive state)
Extra Details
Lemeno iOS and Android Screen Flow
Animated splash screen:
Splash Screen Animation can be found here: Splash Screen Animation
(150210): https://www.dropbox.
com/sh/huq6mjhveqphbfj/AABbBQPSxzwvm2BNULRG6Ehia?dl=0
Splash screen: Image Sequence
https://www.dropbox.com/sh/c76lcavjliboz70/AAA1xDoEfvAue9qDIJ1CNqOla?
dl=0
Updated Image Sequence 150312
https://www.dropbox.com/sh/wsvcqgiodhl2vmt/AACV_t_jTrxUDcuVHC6sVR1ha?
dl=0
Splash screen
Lemeno iOS and Android Screen Flow
●
Walk through screens
Lemeno iOS and Android Screen Flow
● Walk through screens:
Walk through screens
Lemeno iOS and Android Screen Flow
● Walk through screens:
Walk through screens
Lemeno iOS and Android Screen Flow
● Walk through screens:
Walk through screens
Lemeno iOS and Android Screen Flow
● Walk through screens:
Walk through screens
Lemeno iOS and Android Screen Flow
● The app should automatically recognize the country the user is in
● Country code: +971 should also automatically populate as a prefix to the phone
number
● If the user changes the location manually, the phone number prefix should
update automatically to that new location too.
● “Verify Me” should have a tap effect
Note to Dev:
if the User address book has friends without the country code ex: 0501234567, then will
replace the first digit “0” with the User current country code ex +971501234567
Sign up
Lemeno iOS and Android Screen Flow
Sign up - Confirmation
● Once user registers using a mobile number. A 6-digit authentication code will be
sent to that number via SMS to verify the user.
● User has to input the 6-digit activation code to complete validation and login to
the app.
● We have a “Resend it” under “Confirm Code” in case the user never got the SMS
● “Back” in case User mistyped his mobile number
● Once user hits “Back”, the user will see the same number in the previous screen
as he typed it
Lemeno iOS and Android Screen Flow
● Once the user verifies the confirmation code, he will be redirected to the profile
setup screen where he can add:
○ Photo (Optional)
○ First Name ( Mandatory )
○ Last Name (Mandatory)
○ E-mail ( Mandatory )
○ Password - ( Mandatory )
○ Status (Optional)
● Let’s Get Started to have a tap effect
User Profile
Lemeno iOS and Android Screen Flow
● For Photo cropping, we need it to allow circular image cropping like the
screenshot, so we may need to write our own component to allow this.
● This should be for both iOS and Android
Crop Avatar photo screen
Lemeno iOS and Android Screen Flow
Slider Menu Screen
● Tapping on user’s profile photo will take user to the SETTINGS >
PROFILE section
● Menu open/close transitions should animate sliding smoothly
● Indication number next (Home,Events,Messages) to indicate on any new
updates received in real-time
● Add smooth sliding effect: tapping outside the menu, then the menu closes
● We also need a swipe to open Menu and swipe to close Menu as the user
slides left/right over the dividing line.
Lemeno iOS and Android Screen Flow
Note on “No Data Screens”
Let’s have a bigger font sizes for Welcome to Lemeno, maybe a size or two bigger than the rest,
and the rest of the slides “No Data Screens” one font bigger to be more visible than it is.
Lemeno iOS and Android Screen Flow
Home: New Invites (No Data Screens)
Text :
If you wanna start an event of your own, just tap the + at any
time, which we put conveniently on the top right of every page.
Invite Friends to Lemeno (f of friends to be in capital)
Lemeno iOS and Android Screen Flow
● We have 2 pages: “Invites” and “Activity” (pagination)
● Sliding anywhere on the page will shift to the next page “Invites” and
“Activity”
● All invites in this section are ones that have not been answered yet
○ New : All new invitations organized from the latest received
invitation at the top (Sort by chronological order)
○ Urgent : All new invitations organized by the soonest expiring
invitation first (Sorted chronologically after by expiring time)
○ Agenda: All new invitations organized by the start date of the
event (Soonest event shows first)
● Grey tabs should be listed by (by events received date):
○ Received Today
○ Received Yesterday
○ Received Earlier This Week (Starting after yesterday till the end
of this week)
○ Received Last Week
○ Received Over 2 weeks ago (Starting after Last week till the end
of the 3 weeks)
● Tapping on event will load up the Event details Page
Home: New Invites
Lemeno iOS and Android Screen Flow
Urgent Invites (No Data Screens)
Slide 2:
If you don’t wanna miss out on any upcoming events, come here
to view your invites sorted by when they’re set to expire.
Lemeno iOS and Android Screen Flow
Note to Dev:
● Please correct the title “Expires yesterday” to “Expires tomorrow”
(typographic mistake in the UI design)
● Grey tabs should be listed by (by events expiry date):
○ Expires Today
○ Expires Tomorrow
○ Expires Later This Week
○ Expires Next Week
○ Expires Later This year
● All invites must fit in either of these sections depending on their date.
Urgent Invites
Lemeno iOS and Android Screen Flow
Agenda Invites (No Data Screens)
Slide 3:
If you’d rather see what’s happening on a certain day, here is where you
can see your invites sorted by when they’re set to take place.
Lemeno iOS and Android Screen Flow
Note to Dev:
● Please correct the title “Happening yesterday” to “Happening tomorrow”
(typographic mistake)
● Grey tabs should be listed by (by events happening date):
○ Happening Today
○ Happening Tomorrow
○ Happening Later This Week
○ Happening Next Week
○ Happening in 2 Weeks
○ Happening Later This Year
Agenda Invites
Lemeno iOS and Android Screen Flow
● When a user taps on REPLY, the button will reverse its colors to
become full orange with white text.
● At that point, the options of IM IN and IM OUT will slide in from the right
(animated transition) and fully cover up the content of that row so that
only IM IN and IM OUT shows.
● There will be an arrow that will slide these buttons out to the right again
to return things to their normal unanswered state
● Once a user replies (either answer), that row should shrink vertically and
disappear (animated transition). The animation transition should be
upwards.
● The 2 buttons will have the below behaviors:
○ “I’M IN” - to accept the invitation (event admin will receive a push
notification and news feed update)
○ “I’M OUT” - to decline an invitation (event admin will receive a
push notification and news feed update)
New Invites > Tap on Reply
Lemeno iOS and Android Screen Flow
Activity Feed (No Data Screens)
Slide 4:
Here is where you’ll constantly be informed of all changes and updates to
either an event you're going to or an invite you’ve sent out.
Lemeno iOS and Android Screen Flow
“Activity” contains colored keywords colored:
○ Invited : Green
○ Declined : Red
○ Changed: Orange
● All listings in news feed contain friendly timestamps. i.e: 3m ago, 2h
ago, 5d ago
● It will be infinite scroll
● + button in the top right on the orange background always will behave
like the “Create new event”
Please follow the GDoc for Lemeno "Activity" scenarios
https://drive.google.com/open?
id=1tNbxsF1toaEumnYMmN3NRdbo2vSCec8uBLAW_EUr5e4&authuser=0
Activity Feed
Lemeno iOS and Android Screen Flow
Contacts > Lemeno Contacts
(No Data Screens)
Slide 5:
Once your friends join Lemeno they’ll start showing up
here, and each with their own profile jam packed with fun
stats helping you gauge your relationship with them.
Tell a friend
Lemeno iOS and Android Screen Flow
Contacts > Lemeno Contacts
● All users in this list must have the small green lemeno icon next to their profile
pic
● Alphabet Letters should stay fixed at the top (for each letter category) as long
as the user is searching within this alphabet range. i.e: If the user has 50
friends whose names start with “A”, then the A label in grey should always be
visible and fixed up top.
Lemeno iOS and Android Screen Flow
Contacts > Lemeno Contacts > User Profile
Page (No Data Screens)
Slide 7:
Calculates the amount of time they’ve confirmed but either
cancelled or never showed up
Lemeno iOS and Android Screen Flow
Contacts > Lemeno Contacts >
User Profile Page
● Please animate the charts, it would look good to have the numbers and
charts animate from 0% to their final % upon screen load. Same for the 80%
and 20h at the top to have them increase like a stopwatch animation from 0
to their final number
● Call icon will call this number using the native phone dialer
● SMS icon will open up the native messaging client with the phone number of
this user already filled out
● Whatsapp icon (same behavior as SMS icon but for whatsapp. If not
possible, then let it just open up whatsapp and create new message)
● Lemeno icon and “Create an event” button: will create a new event in
Lemeno with this user already in the WHO field (equivalent to “Create an
event” link below)
● These icons must have a tap effect to go from their outlined state to a full
color filled state on tap.
● Block (friend name) will not allow that friend to see any activity or invite the
guest to any events. In turn, this friends name will be added to the blocked
list in the SETTINGS section (Under privacy).
● These links need a tap effect too
Lemeno iOS and Android Screen Flow
In app Notification
● This display works anywhere across the entire app
● Tapping on the in-app notification will take the users to either the new invite (if
it’s a new invite), or the event details page (if edit/changed event details)
Lemeno iOS and Android Screen Flow
Contacts > All Contacts
● All users in this list are the contacts as they appear in the User phone book.
● In this list though, whoever is a Lemeno User will have the status under his
name and the small Lemeno icon under the profile pic.
● Search have the default search behavior of the contact list on the device (with
real time results. i.e: As the user types, the list below filters instantly)
Lemeno iOS and Android Screen Flow
Contacts > All Contacts
User Profile Screen (Non-Lemeno User)
● Icons must turn to full color fill on tap (tapping effect)
● Picture of contact will only show if the user’s mobile device has placed an
image for this contact. Otherwise a standard avatar should show in place
● Invite to Lemeno will open up the native app sharing feature but with this
friend as a recipient. Users can invite friends either by SMS or Whatsapp
Lemeno iOS and Android Screen Flow
Contacts > Search (No Data Screens)
● Search have the default search behavior of the contact list on the device (with
real time results. i.e: As the User types, the list below filters instantly)
Lemeno iOS and Android Screen Flow
Contacts > Search
● Search have the default search behavior of the contact list on the device (with
real time results. i.e: As the User types, the list below filters instantly)
Lemeno iOS and Android Screen Flow
Messages (Event List View)
(No Data Screens)
Slide 8:
If the messaging feature has been enabled for an event, here is where
guests and the event organiser can start communicating with one
another.
Lemeno iOS and Android Screen Flow
Messages (Event List View)
● Messages will be organized by Event Titles
● The most recent active conversations always move to the top of the list
(regardless of any other details of that event.)
● This page will appear empty until:
○ A User has written to an event admin on a particular event then the
event title will show and the User message will be in the next page.
○ An admin creates an event and has allowed messaging, then this listing
will automatically show but with 0 conversations on the next screen
(this’s in case the Admin would like to send broadcast to the guest list)
● Swiping left on each row will show:
○ Mute: stop notification on this event
○ Disable: disable messaging on this event all together
○ Delete: Delete all messages within this event (but keep messaging open
to any other guests who may want to write)
Lemeno iOS and Android Screen Flow
Messages (Conversation List View)
(No Data Screens)
Slide 9:
This event has no conversation yet. Send a
message to contact the event organiser or
other guests.
Lemeno iOS and Android Screen Flow
Messages > Message Board
● A single message board common to all confirmed and pending guests to an
event where everyone can chat with everyone.
● Should mention when the conversation started (January 27, 2015).
● If the conversation splits across different days, the new date should show in the
center and in between the messages where the day was split (See Whatsapp
for reference)
● “Back” button goes back to screen “Messages” (Event List View)
● The user who is writing will appear on the right and in a yellow message box.
● Each chat window should start with the users name. i.e: “George says:”, and
“Baher says:” with the rest of the message split on the next line.
Lemeno iOS and Android Screen Flow
Slide 10:
Put your contacts into circles to make it easier to invite
certain groups of people to an event.
Circles (No Data Screens)
Lemeno iOS and Android Screen Flow
Circles
● To add a new circle, the user must pull the screen down which will reveal the
space to add a new circle
● Sort by latest added circles first
● Swiping left on a circle name opens the contextual menu that allows:
○ Edit Circle Name
○ Delete Circle (delete confirmation prompt “Are you sure you want to
delete”?
● By default, the app will come with a predefined set of circles (which the user
can delete if he doesn’t want them). These circles are:
○ My friends
○ My family
○ Work colleagues
● Tapping on the right arrow of each circle will reveal the users within that circle
(Discussed on next page)
Lemeno iOS and Android Screen Flow
Circles > Add New Circle
● The user should be able to pull down the screen to add a new circle
with this demonstrated animation transition. i.e: The more the user
pulls the screen down (from the previous screen), the more of this light
purple background shows) until it loads fully into place.
● He can type in the light purple area which will replace the placeholder
text (Add a new circle). The keyboard should have a “DONE” button to
confirm the text entry. (max 35 characters)
● If the user taps on EDIT, then the name of the circle highlights within
the row so he can simply type and replace the text there instantly.
Lemeno iOS and Android Screen Flow
● Any time a circle has no users in it, this screen should show (i.e: When
a user creates a new circle, or removes all users from an existing
circle). He will be prompted to add users by checking next to their
names.
● Once DONE is pressed, the user will be directed to the next screen
“Circle > Details Page”
Circles > Add/Edit/Delete Users in Circle
Lemeno iOS and Android Screen Flow
● Search have the default search behavior of the contact list on the device
(with real time results. i.e: As the user types, the list below filters instantly)
Circle > Search
Lemeno iOS and Android Screen Flow
● Lets remove the the rearrange icon (3 horizontal lines on the right).
● Swiping left on a name will allow the user to access a menu which will allow him
to delete the user from that circle instantly.
Circle > Details Page
Lemeno iOS and Android Screen Flow
Events > Mine (No Data Screens)
Slide 11:
Any event you’ve created will show up here, and the coloured bars
on the left will show you whether they’ve been confirmed, still
pending, or cancelled.
Lemeno iOS and Android Screen Flow
● This tab shows all the events that the user is hosting
● Events are categorized by date (todays date, and flow chronologically)
● Each listing has a colored vertical strip to denote its status:
○ Green: The event is confirmed and on as planned
○ Orange: The event is pending the minimum required guests to join.
● Status icons:
○ Admin icon: If this event has been given admin rights to any of the
confirmed guests. If yes, the icon goes from its passive (dim) state to a
full colored state.
○ Repeat: If this event is a repeat event, the icon will go from its passive
(dim) state to a full colored state.
● Swiping left on each will show a menu that allows the admin to:
○ Edit: Edit event details by going to the event creation page with all
details already filled out
○ Cancel: To cancel the event all together and inform guests with a push
and activity feed notification that it has been cancelled.
Events > Mine
Lemeno iOS and Android Screen Flow
Events > Upcoming (No Data Screens)
Slide 12:
Any invitation you’ve accepted will show up here and
becomes an upcoming event. Check your settings to decide
on how you want Lemeno to do handle cancelled events.
Lemeno iOS and Android Screen Flow
● This tab shows all the upcoming events that the user has confirmed attendance
to. Sorted by the most happening soon first.
● Events are categorized by date (todays date, and flow chronologically)
● Each listing has a colored vertical strip to denote its status:
○ Green: The event is confirmed and on as planned
○ Orange: The event is pending the minimum required guests to join.
● Status icons:
○ Admin icon: If this event has been given admin rights to any of the
confirmed guests. If yes, the icon goes from its passive (dim) state to a
full colored state.
○ Repeat: If this event is a repeat event, the icon will go from its passive
(dim) state to a full colored state.
● Swiping left on each will show a menu that allows:
Actually I’m Out: Which will change the users attendance to an event and
affect his flakiness rating (but to a lesser extent).
Algorithm to calculate flakiness in this case to be defined here.
“Lemeno Logic + Algorithms 150129” https://docs.google.
com/document/d/1yXyzGDfZjBo7pmtdR-J-
u5zeH6scYWX3CLbmmwjAuCs/edit?usp=sharing
Events > Upcoming
Lemeno iOS and Android Screen Flow
Events > Past (No Data Screens)
Slide 13:
Any past events you’ve gone to will show up here. Check your
settings to decide on how you want Lemeno to handle them.
Lemeno iOS and Android Screen Flow
Events > Past
● This tab shows all the past events that the user has attended. Sorted by the
most recent soon first.
● Events are categorized by date (most recent date, and flow chronologically in
reverse)
● Each listing has a colored vertical strip to denote its status:
○ Red: The event is done
● Status icons:
○ Admin icon: If this event has been given admin rights to any of the
confirmed guests. If yes, the icon goes from its passive (dim) state to
a full colored state.
○ Repeat: If this event is a repeat event, the icon will go from its passive
(dim) state to a full colored state.
● Swiping left on each will show a menu that allows:
○ Remove: Which will allow a user to remove this completed event from
his list.
Lemeno iOS and Android Screen Flow
Event Details > Invite not replied yet
● This page will always be a pop up that slides in from the bottom of the page. If
the user taps on the X, it will slide out to the bottom and reveal whatever the
previous screen was.
● In Event body description, please remove “More” and make it scroll in case the
admin has typed in more than can show in this area
● On Event cover photo, please keep the black transparent gradient mask at the
bottom so that the white text above always shows.
● User can tap on the map preview to open animate the map to become a full
page view (shown in the next screen). By default, the pin of the location should
be centered in that square.
● As long as the user hasn’t responded to the invite, the user can see the amount
of time left to respond to this event. This time should count down (hourly) until
the invitation expires. If no invitation expiry is specified from the event creation
page, then this will count down to the event start time by default.
Lemeno iOS and Android Screen Flow
Event Details > Full page map view
● Tapping on left top corner to minimize map view back to event detail page. It
must close in an animated way back to the original dimensions. In the top left
corner, the user should be able to see a glimpse of the corner of the cover
photo of the previous screen.
● Directions : will take user to google map with direction from User ”my location”
to the event coordinates
● Location icon (in the top right) will always take the user back to the default view
with the event location centered in the screen.
Lemeno iOS and Android Screen Flow
Event Details > Replied
● After the user has confirmed attendance to an event, the “time left to respond”
will change to a reminder. By default, it will be 2 hours reminder before the
event begins.
● Users can tap on this number to reveal other reminder options, such as:
○ 10 minutes
○ 30 minutes
○ 1 hour
○ 2 hours
○ 1 day
○ 2 days
○ 1 week
● Events should sync with the users mobile devices native calendar app unless
they have turned off this option from the SETTINGS screen “Calendar Sync”
● Icons on the right in the grey background should always show in their passive
(dim) display unless the permissions to access each has been granted to them
by the event admin.
● Tapping on GUEST LIST will open up the guest list page (Screen Guest List /
User view)
● +1/2/3 Allowed is not interactive
● Message icon will redirect the user to the MESSAGING section and directly to
the conversation window so they can start typing right away. Once they leave
this section, that conversation should remain in the messaging section.
● “Add Guests” will only show if the admin has made this user an admin also.
Lemeno iOS and Android Screen Flow
Event Details > Replied + Admin Privileges
● If the Event “Admin” (who created the event) made one of the guest as an
Admin, then “ADD GUESTS” will be active. He can then invite his friends to the
Event initiated by the original admin.
● Invitations sent to those guests will be in the format of :
“User 2 has invited you to XYZ on behalf of User 1”.
● Both admins will receive push notifications of their response and news feed
posts.
Lemeno iOS and Android Screen Flow
Event Details > Admin View
● Admin can:
○ EDIT: will direct Admin to event creation screen with all filled in data
available so he can edit instantly. Editing anything will send a push
notification and activity feed update to all guests that the admin has
changed the details of the event.
○ REPEAT: Let’s have “REPEAT OFF” as shown in the screen shot. If
repeat is on, the circle changes to a solid-fill blue with text in white
○ DELETE: To delete the event entirely. Deleting will send a push
notification and activity feed update to all guests that the admin has
deleted the event.
● Allows +1/2/3 shows the allowed plus guests for this event (If permitted)
● Message should be dimmed / inactive since the admin can’t message himself.
● Add Guests should be dimmed / inactive
Lemeno iOS and Android Screen Flow
Guest List / User view (No Data Screens)
Slide 14:
No guests have confirmed attendance to this event yet.
Lemeno iOS and Android Screen Flow
Guest List / User view
● 3 tabs: “IN” / “Pending” / “OUT”
● We have number indication next each tab title
● If the admin has specified a number of maximum guests, and 25% of those
spots are still available, then a line at the bottom of the screen should show
saying “Hurry. Only X spots remaining”.
Lemeno iOS and Android Screen Flow
Guest List / Admin view
● 3 tabs: “IN” / “Pending” / “OUT”
● We have number indication next each tab title
● The default behavior is: all guests marked as attended once the event
completed (i.e: checked box or empty box have the same value).
● If the admin double taps on a checkbox, it turns into an X which means the
user said they were coming (they were confirmed in the IN tab) but never came
to the event. This bares maximum flakiness for that user.
● If the admin has promoted a guest to become an admin also, that user will get
an admin icon next to their name and their status will change the number of
confirmed guests from that user. This number should show in the IN tab as an
addition to the original admins confirmed guests
● Sliding on each name/row will show 2 options:
○ Make Admin / Remove Admin
○ Uninvite
Lemeno iOS and Android Screen Flow
Guest List: Search (No Data Screens)
Lemeno iOS and Android Screen Flow
Guest List: Search
● Search have the default search behavior of the contact list on the device (with
real time results. i.e: As the user types, the list below filters instantly)
Lemeno iOS and Android Screen Flow
Create Event > What
● Tap on camera icon to take a new picture or select one from the camera roll
● Event title max characters: 30 max
● Event description : No max characters.
Lemeno iOS and Android Screen Flow
Create Event > Where & When
● The tabs should animate quickly to open and close (where & when)
● Tap on the pin icon to add a location
● Note on this location: 120 character limit
● Start Date: Tap to open date/time selector: Note: The user should not be able
to select a date in the past.
● End Date: tap to open date/time selector. Note: END DATE shouldn’t allow the
user to place the end date before the start date, and no date from the past.
● Invitation Expiry Date:
Date picker to show when the entire invitation will expire.
i.e: If no one responds before the deadline then it disappears from their “New
Invites”
○ Don’t allow users to add Expiry in the past
○ Don’t allow users to add Expiry after the “start date”
(allow to add Expiry before “start date” and not after “start date”)
Lemeno iOS and Android Screen Flow
Create Event > Location
● Same as Uber‘s location selection where the pin is always centered, and users
can move the map around behind the centered pin.
● Search: will show results nearby location only based on User current location
Lemeno iOS and Android Screen Flow
Create Event > Date/Time Selector
● Can we use native datepicker and add theme frame on it
● Don’t allow to create event in the past
● Don’t allow to create “end date” before “start date”
● Don’t allow to add “expiry date” after “start date”
Lemeno iOS and Android Screen Flow
Create Event > Who
● By default, the count will be “None” but will later will populate with the total
number of invited guests.
● Admin will need to tap on the “right” arrow to begin inviting guests
Lemeno iOS and Android Screen Flow
Create Event > Who > Invite Guests
● Admin can scroll down the list and tick who he would like to invite, or he can
type in contact names at the top.
Lemeno iOS and Android Screen Flow
Create Event > Who > Invite Guests
● Typing in a contact name will automatically filter the contacts below in real-
time. Tapping on a friend from that list will automatically load the entire contact
list again. i.e: The user shouldn’t have to delete his entry to go back to the full
contact list again.
Lemeno iOS and Android Screen Flow
Create Event > Who > Invite Guests
● Alternatively, the admin can tap on the circles tab (which should open in an
animated transition) and allow the admin to invite a circle
● Selecting a circle will add all the individuals of that circle in the summary of total
invited guests (as seen on screen 52). i.e: The circle name itself should not
show.
Lemeno iOS and Android Screen Flow
Create Event > Who > Invite Guests
● The guest count will now show the total invites guests (as opposed to “none” as
shown in screen 48).
● This screen will show all the guests who have been invited by their names (i.e:
Even if they were invited by selecting a circle, their names show here).
● Lemeno users will appear in grey.
● Non-Lemeno users will appear in red.
○ When the admin goes to send this invite, he will get a notification letting
him know that X users are non-Lemeno users and will receive their
invite by SMS. He can either then choose to “Edit Guests”, or “Proceed’
which will send the text messages as :
“User 1 has invited you to an event on Lemeno. To see your invite,
please download Lemeno from XXXX, and sign up using the YYY
phone number”. Have fun!”
● The “Send” button at the top should now not be dimmed/inactive, but rather full
color and ready to send out. This happens when at least 1 guest has been
added to an event.
Lemeno iOS and Android Screen Flow
Create Event > How
● Animated tab transition. “Expand and collapse transition”
● Min: numbers typing pad
● Show error notification if user add 0 in “Min” and “Max”:
“You can not set 0 as and an entry”
● Allow + guests:
Dropdown showing only 4 options:
○ None
○ +1
○ +2
○ +3
● Allow guests to view guest list:
Drop down showing only 2 options:
Yes (allows guests to view guest list)
No (disabled invited guests from viewing guest list)
● Repeat every:
Drop down showing (similar to Google native Calendar app):
○ Every day
○ Every day
○ Every week
○ Every month
○ Every Tuesday (or whatever day it currently is)
○ First Tuesday of every month (or whatever day it currently is)
FYR https://www.dropbox.com/sh/bsjglwg2eatedg5/AADG8d6j9T7lsKvTM03cx-fWa?dl=0
● “Declined Invitation Alert” will inform the admin every time an invited guest declines an
invitation. This will then load a pop up that will allow him to “Replace” (invite someone
else. Link to screen 49), or “Ignore”.
Lemeno iOS and Android Screen Flow
Settings
● Calendar Sync
○ Slide Right: Enabled (In Green)
○ Slide Left: Disabled (In Red)
●
Lemeno iOS and Android Screen Flow
About
●
●
Lemeno iOS and Android Screen Flow
About/Contact US
● SEND to submit this as an email form to the admin of the app (We require AA
email)
● layover notification to inform the user of the status of his submission
○ Success:
“Thank you for reaching out to us. We will get back to you as soon as
possible
○ “Fail”:
Ooops. Your message didn’t go through. Please try again!
Lemeno iOS and Android Screen Flow
FAQ
List of FAQ’s can be found here:
https://docs.google.com/document/d/1YIwFABi9TCQ-
g7QTjvISTh2D8JTV7aO8FVAz4UpnJbc/edit?usp=sharing
Lemeno iOS and Android Screen Flow
Notifications
● Turning ON/OFF “All Notifications” will disable/enable all the options below.
Lemeno iOS and Android Screen Flow
Event settings
● Past Events
○ Remove after 1 day
○ Remove after 1 week
○ Remove after 1 month
○ Remove after 1 year
○ Never remove, until i delete (Manual)
● Cancelled Events
Keep until event begins
Keep until I delete
Lemeno iOS and Android Screen Flow
Account page
●
●
Lemeno iOS and Android Screen Flow
Account page
● Phone number should show the registered phone number on Lemeno
● Service: For now, all users will be a “Lifetime” membership until further notice
Lemeno iOS and Android Screen Flow
Change Number
● User will receive new verification code on his new sim number and he needs to
input the code number for validation
● When users enter the new country code and phone number, the validation
process should happen again. In this case, the old number becomes inactive,
and the new number replaces this user account. No events should be deleted
or lost in this process!
Lemeno iOS and Android Screen Flow
Delete account
● User will receive new verification code on his new sim number and he needs to
input the code number for validation
● Upon successful termination, all details of this user and his events should be
deleted from the server
● Termination pop up should take the user back to the first sign up screen as if
this user just downloaded the app
Lemeno iOS and Android Screen Flow
Delete account
● User will receive new verification code on his new sim number and he needs to
input the code number for validation
●
Lemeno iOS and Android Screen Flow
Privacy
● Account visibility
○ Slide Right: Visible (In Green)
○ Slide Left : Invisible (In Red)
● Shows the total number of blocked users
● Profile Photo:
○ Visible to everyone
(to whoever has this user on his phone book)
○ Visible to my contacts only
(both “User contacts” must be on each others phone books)
○ Visible to no one
● Status:
○ Visible to everyone
(to whoever has this user on his phone book)
○ Visible to my contacts only
(both “User contacts” must be on each others phone books)
○ Visible to no one
Lemeno iOS and Android Screen Flow
Blocked Users (No Data Screens)
Lemeno iOS and Android Screen Flow
Blocked Users
Lemeno iOS and Android Screen Flow
● User can update his Photo here
● layover notification to inform the user of the status of his submission
Success:
“Thank you, your data has been sent successfully.”
“Fail”:
“Ooops. Your data didn’t go through. Please try again!”
● User can edit:
Photo (tap to choose from album on mobile device)
First Name
Last Name
E-mail
Status
● Button to “Save Changes” should have tap effect
Profile
Lemeno iOS and Android Screen Flow
Screen notification
●
●

More Related Content

Similar to Lemeno Screen-flow by GS on 150310

Wireframes app i_phone_ios7_example
Wireframes app i_phone_ios7_exampleWireframes app i_phone_ios7_example
Wireframes app i_phone_ios7_exampleAndrew Scott
 
How to Run a Microsoft Teams Live Event
How to Run a Microsoft Teams Live EventHow to Run a Microsoft Teams Live Event
How to Run a Microsoft Teams Live EventPattiRawlick
 
Project overview downs research
Project overview downs researchProject overview downs research
Project overview downs researchDaniel Downs
 
Project Overview: Creating an Authentic Mobile Application Design Mr. Downs
Project Overview: Creating an Authentic Mobile Application Design Mr. DownsProject Overview: Creating an Authentic Mobile Application Design Mr. Downs
Project Overview: Creating an Authentic Mobile Application Design Mr. DownsDaniel Downs
 
How To Create 3D Animation With Smartphone
How To Create 3D Animation With SmartphoneHow To Create 3D Animation With Smartphone
How To Create 3D Animation With SmartphoneMitrobeBusiness
 
Iphone ipad-application
Iphone ipad-applicationIphone ipad-application
Iphone ipad-applicationGuojun Li
 
Welcome to SoftMaker Office for Android.potx
Welcome to SoftMaker Office for Android.potxWelcome to SoftMaker Office for Android.potx
Welcome to SoftMaker Office for Android.potxGeovaneReisdeMoura
 
Lecture 1 rapid android development
Lecture 1   rapid android developmentLecture 1   rapid android development
Lecture 1 rapid android developmentFernando Loizides
 
Boys and Girls Club
Boys and Girls ClubBoys and Girls Club
Boys and Girls Clubrenrok15
 
Connect2Console AFG Assignments 1-10
Connect2Console AFG Assignments 1-10Connect2Console AFG Assignments 1-10
Connect2Console AFG Assignments 1-10mrullahgca
 
Introduction to programming at from novice 2 prof oct 2010 ,ife 2 live
Introduction to programming at from novice 2 prof oct 2010 ,ife 2 liveIntroduction to programming at from novice 2 prof oct 2010 ,ife 2 live
Introduction to programming at from novice 2 prof oct 2010 ,ife 2 liveBabatope Oni
 
how to Delete Telegram account?
how to Delete Telegram account?how to Delete Telegram account?
how to Delete Telegram account?howtodelete
 
Gaming gets a major shot in the arm thanks to the vibrant 5-inch Triluminos d...
Gaming gets a major shot in the arm thanks to the vibrant 5-inch Triluminos d...Gaming gets a major shot in the arm thanks to the vibrant 5-inch Triluminos d...
Gaming gets a major shot in the arm thanks to the vibrant 5-inch Triluminos d...arthur2woodward
 
Nexus 7 Master Setup Document v1-05
Nexus 7 Master Setup Document v1-05Nexus 7 Master Setup Document v1-05
Nexus 7 Master Setup Document v1-05Zane Clark
 
Windows7tipstrickspptversion 12599513345858-phpapp01
Windows7tipstrickspptversion 12599513345858-phpapp01Windows7tipstrickspptversion 12599513345858-phpapp01
Windows7tipstrickspptversion 12599513345858-phpapp01Ramprakash Kumar
 

Similar to Lemeno Screen-flow by GS on 150310 (20)

Wireframes app i_phone_ios7_example
Wireframes app i_phone_ios7_exampleWireframes app i_phone_ios7_example
Wireframes app i_phone_ios7_example
 
Alive with activity
Alive with activityAlive with activity
Alive with activity
 
How to Run a Microsoft Teams Live Event
How to Run a Microsoft Teams Live EventHow to Run a Microsoft Teams Live Event
How to Run a Microsoft Teams Live Event
 
spec
specspec
spec
 
Windows 8 Tutorial
Windows 8 TutorialWindows 8 Tutorial
Windows 8 Tutorial
 
Project overview downs research
Project overview downs researchProject overview downs research
Project overview downs research
 
Project Overview: Creating an Authentic Mobile Application Design Mr. Downs
Project Overview: Creating an Authentic Mobile Application Design Mr. DownsProject Overview: Creating an Authentic Mobile Application Design Mr. Downs
Project Overview: Creating an Authentic Mobile Application Design Mr. Downs
 
How To Create 3D Animation With Smartphone
How To Create 3D Animation With SmartphoneHow To Create 3D Animation With Smartphone
How To Create 3D Animation With Smartphone
 
Iphone ipad-application
Iphone ipad-applicationIphone ipad-application
Iphone ipad-application
 
Welcome to SoftMaker Office for Android.potx
Welcome to SoftMaker Office for Android.potxWelcome to SoftMaker Office for Android.potx
Welcome to SoftMaker Office for Android.potx
 
Lecture 1 rapid android development
Lecture 1   rapid android developmentLecture 1   rapid android development
Lecture 1 rapid android development
 
Boys and Girls Club
Boys and Girls ClubBoys and Girls Club
Boys and Girls Club
 
Connect2Console AFG Assignments 1-10
Connect2Console AFG Assignments 1-10Connect2Console AFG Assignments 1-10
Connect2Console AFG Assignments 1-10
 
Introduction to programming at from novice 2 prof oct 2010 ,ife 2 live
Introduction to programming at from novice 2 prof oct 2010 ,ife 2 liveIntroduction to programming at from novice 2 prof oct 2010 ,ife 2 live
Introduction to programming at from novice 2 prof oct 2010 ,ife 2 live
 
how to Delete Telegram account?
how to Delete Telegram account?how to Delete Telegram account?
how to Delete Telegram account?
 
A Primavera Tutorial
A Primavera TutorialA Primavera Tutorial
A Primavera Tutorial
 
Comp8.ppt
Comp8.pptComp8.ppt
Comp8.ppt
 
Gaming gets a major shot in the arm thanks to the vibrant 5-inch Triluminos d...
Gaming gets a major shot in the arm thanks to the vibrant 5-inch Triluminos d...Gaming gets a major shot in the arm thanks to the vibrant 5-inch Triluminos d...
Gaming gets a major shot in the arm thanks to the vibrant 5-inch Triluminos d...
 
Nexus 7 Master Setup Document v1-05
Nexus 7 Master Setup Document v1-05Nexus 7 Master Setup Document v1-05
Nexus 7 Master Setup Document v1-05
 
Windows7tipstrickspptversion 12599513345858-phpapp01
Windows7tipstrickspptversion 12599513345858-phpapp01Windows7tipstrickspptversion 12599513345858-phpapp01
Windows7tipstrickspptversion 12599513345858-phpapp01
 

Lemeno Screen-flow by GS on 150310

  • 1. Lemeno iOS and Android Mobile App Screen Flow March 10, 2015
  • 2. Lemeno iOS and Android Screen Flow Updated design links 150210 Splash Screen Animation (150210): https://www.dropbox.com/sh/huq6mjhveqphbfj/AABbBQPSxzwvm2BNULRG6Ehia?dl=0 Updated UI (150210 NH): https://www.dropbox.com/sh/gmj6poq833my9ow/AACgJ2J2FrhPVWPDuPoTf5S0a?dl=0 Updated AI (LemenoMobileApp NH 150210.ai): https://www.dropbox.com/s/3tpup7sfttflddk/LemenoMobileApp%20NH%20150210.ai?dl=0 Only buttons and tabs should have a tap effect (which by default will be 80% opacity of the inactive state) Extra Details
  • 3. Lemeno iOS and Android Screen Flow Animated splash screen: Splash Screen Animation can be found here: Splash Screen Animation (150210): https://www.dropbox. com/sh/huq6mjhveqphbfj/AABbBQPSxzwvm2BNULRG6Ehia?dl=0 Splash screen: Image Sequence https://www.dropbox.com/sh/c76lcavjliboz70/AAA1xDoEfvAue9qDIJ1CNqOla? dl=0 Updated Image Sequence 150312 https://www.dropbox.com/sh/wsvcqgiodhl2vmt/AACV_t_jTrxUDcuVHC6sVR1ha? dl=0 Splash screen
  • 4. Lemeno iOS and Android Screen Flow ● Walk through screens
  • 5. Lemeno iOS and Android Screen Flow ● Walk through screens: Walk through screens
  • 6. Lemeno iOS and Android Screen Flow ● Walk through screens: Walk through screens
  • 7. Lemeno iOS and Android Screen Flow ● Walk through screens: Walk through screens
  • 8. Lemeno iOS and Android Screen Flow ● Walk through screens: Walk through screens
  • 9. Lemeno iOS and Android Screen Flow ● The app should automatically recognize the country the user is in ● Country code: +971 should also automatically populate as a prefix to the phone number ● If the user changes the location manually, the phone number prefix should update automatically to that new location too. ● “Verify Me” should have a tap effect Note to Dev: if the User address book has friends without the country code ex: 0501234567, then will replace the first digit “0” with the User current country code ex +971501234567 Sign up
  • 10. Lemeno iOS and Android Screen Flow Sign up - Confirmation ● Once user registers using a mobile number. A 6-digit authentication code will be sent to that number via SMS to verify the user. ● User has to input the 6-digit activation code to complete validation and login to the app. ● We have a “Resend it” under “Confirm Code” in case the user never got the SMS ● “Back” in case User mistyped his mobile number ● Once user hits “Back”, the user will see the same number in the previous screen as he typed it
  • 11. Lemeno iOS and Android Screen Flow ● Once the user verifies the confirmation code, he will be redirected to the profile setup screen where he can add: ○ Photo (Optional) ○ First Name ( Mandatory ) ○ Last Name (Mandatory) ○ E-mail ( Mandatory ) ○ Password - ( Mandatory ) ○ Status (Optional) ● Let’s Get Started to have a tap effect User Profile
  • 12. Lemeno iOS and Android Screen Flow ● For Photo cropping, we need it to allow circular image cropping like the screenshot, so we may need to write our own component to allow this. ● This should be for both iOS and Android Crop Avatar photo screen
  • 13. Lemeno iOS and Android Screen Flow Slider Menu Screen ● Tapping on user’s profile photo will take user to the SETTINGS > PROFILE section ● Menu open/close transitions should animate sliding smoothly ● Indication number next (Home,Events,Messages) to indicate on any new updates received in real-time ● Add smooth sliding effect: tapping outside the menu, then the menu closes ● We also need a swipe to open Menu and swipe to close Menu as the user slides left/right over the dividing line.
  • 14. Lemeno iOS and Android Screen Flow Note on “No Data Screens” Let’s have a bigger font sizes for Welcome to Lemeno, maybe a size or two bigger than the rest, and the rest of the slides “No Data Screens” one font bigger to be more visible than it is.
  • 15. Lemeno iOS and Android Screen Flow Home: New Invites (No Data Screens) Text : If you wanna start an event of your own, just tap the + at any time, which we put conveniently on the top right of every page. Invite Friends to Lemeno (f of friends to be in capital)
  • 16. Lemeno iOS and Android Screen Flow ● We have 2 pages: “Invites” and “Activity” (pagination) ● Sliding anywhere on the page will shift to the next page “Invites” and “Activity” ● All invites in this section are ones that have not been answered yet ○ New : All new invitations organized from the latest received invitation at the top (Sort by chronological order) ○ Urgent : All new invitations organized by the soonest expiring invitation first (Sorted chronologically after by expiring time) ○ Agenda: All new invitations organized by the start date of the event (Soonest event shows first) ● Grey tabs should be listed by (by events received date): ○ Received Today ○ Received Yesterday ○ Received Earlier This Week (Starting after yesterday till the end of this week) ○ Received Last Week ○ Received Over 2 weeks ago (Starting after Last week till the end of the 3 weeks) ● Tapping on event will load up the Event details Page Home: New Invites
  • 17. Lemeno iOS and Android Screen Flow Urgent Invites (No Data Screens) Slide 2: If you don’t wanna miss out on any upcoming events, come here to view your invites sorted by when they’re set to expire.
  • 18. Lemeno iOS and Android Screen Flow Note to Dev: ● Please correct the title “Expires yesterday” to “Expires tomorrow” (typographic mistake in the UI design) ● Grey tabs should be listed by (by events expiry date): ○ Expires Today ○ Expires Tomorrow ○ Expires Later This Week ○ Expires Next Week ○ Expires Later This year ● All invites must fit in either of these sections depending on their date. Urgent Invites
  • 19. Lemeno iOS and Android Screen Flow Agenda Invites (No Data Screens) Slide 3: If you’d rather see what’s happening on a certain day, here is where you can see your invites sorted by when they’re set to take place.
  • 20. Lemeno iOS and Android Screen Flow Note to Dev: ● Please correct the title “Happening yesterday” to “Happening tomorrow” (typographic mistake) ● Grey tabs should be listed by (by events happening date): ○ Happening Today ○ Happening Tomorrow ○ Happening Later This Week ○ Happening Next Week ○ Happening in 2 Weeks ○ Happening Later This Year Agenda Invites
  • 21. Lemeno iOS and Android Screen Flow ● When a user taps on REPLY, the button will reverse its colors to become full orange with white text. ● At that point, the options of IM IN and IM OUT will slide in from the right (animated transition) and fully cover up the content of that row so that only IM IN and IM OUT shows. ● There will be an arrow that will slide these buttons out to the right again to return things to their normal unanswered state ● Once a user replies (either answer), that row should shrink vertically and disappear (animated transition). The animation transition should be upwards. ● The 2 buttons will have the below behaviors: ○ “I’M IN” - to accept the invitation (event admin will receive a push notification and news feed update) ○ “I’M OUT” - to decline an invitation (event admin will receive a push notification and news feed update) New Invites > Tap on Reply
  • 22. Lemeno iOS and Android Screen Flow Activity Feed (No Data Screens) Slide 4: Here is where you’ll constantly be informed of all changes and updates to either an event you're going to or an invite you’ve sent out.
  • 23. Lemeno iOS and Android Screen Flow “Activity” contains colored keywords colored: ○ Invited : Green ○ Declined : Red ○ Changed: Orange ● All listings in news feed contain friendly timestamps. i.e: 3m ago, 2h ago, 5d ago ● It will be infinite scroll ● + button in the top right on the orange background always will behave like the “Create new event” Please follow the GDoc for Lemeno "Activity" scenarios https://drive.google.com/open? id=1tNbxsF1toaEumnYMmN3NRdbo2vSCec8uBLAW_EUr5e4&authuser=0 Activity Feed
  • 24. Lemeno iOS and Android Screen Flow Contacts > Lemeno Contacts (No Data Screens) Slide 5: Once your friends join Lemeno they’ll start showing up here, and each with their own profile jam packed with fun stats helping you gauge your relationship with them. Tell a friend
  • 25. Lemeno iOS and Android Screen Flow Contacts > Lemeno Contacts ● All users in this list must have the small green lemeno icon next to their profile pic ● Alphabet Letters should stay fixed at the top (for each letter category) as long as the user is searching within this alphabet range. i.e: If the user has 50 friends whose names start with “A”, then the A label in grey should always be visible and fixed up top.
  • 26. Lemeno iOS and Android Screen Flow Contacts > Lemeno Contacts > User Profile Page (No Data Screens) Slide 7: Calculates the amount of time they’ve confirmed but either cancelled or never showed up
  • 27. Lemeno iOS and Android Screen Flow Contacts > Lemeno Contacts > User Profile Page ● Please animate the charts, it would look good to have the numbers and charts animate from 0% to their final % upon screen load. Same for the 80% and 20h at the top to have them increase like a stopwatch animation from 0 to their final number ● Call icon will call this number using the native phone dialer ● SMS icon will open up the native messaging client with the phone number of this user already filled out ● Whatsapp icon (same behavior as SMS icon but for whatsapp. If not possible, then let it just open up whatsapp and create new message) ● Lemeno icon and “Create an event” button: will create a new event in Lemeno with this user already in the WHO field (equivalent to “Create an event” link below) ● These icons must have a tap effect to go from their outlined state to a full color filled state on tap. ● Block (friend name) will not allow that friend to see any activity or invite the guest to any events. In turn, this friends name will be added to the blocked list in the SETTINGS section (Under privacy). ● These links need a tap effect too
  • 28. Lemeno iOS and Android Screen Flow In app Notification ● This display works anywhere across the entire app ● Tapping on the in-app notification will take the users to either the new invite (if it’s a new invite), or the event details page (if edit/changed event details)
  • 29. Lemeno iOS and Android Screen Flow Contacts > All Contacts ● All users in this list are the contacts as they appear in the User phone book. ● In this list though, whoever is a Lemeno User will have the status under his name and the small Lemeno icon under the profile pic. ● Search have the default search behavior of the contact list on the device (with real time results. i.e: As the user types, the list below filters instantly)
  • 30. Lemeno iOS and Android Screen Flow Contacts > All Contacts User Profile Screen (Non-Lemeno User) ● Icons must turn to full color fill on tap (tapping effect) ● Picture of contact will only show if the user’s mobile device has placed an image for this contact. Otherwise a standard avatar should show in place ● Invite to Lemeno will open up the native app sharing feature but with this friend as a recipient. Users can invite friends either by SMS or Whatsapp
  • 31. Lemeno iOS and Android Screen Flow Contacts > Search (No Data Screens) ● Search have the default search behavior of the contact list on the device (with real time results. i.e: As the User types, the list below filters instantly)
  • 32. Lemeno iOS and Android Screen Flow Contacts > Search ● Search have the default search behavior of the contact list on the device (with real time results. i.e: As the User types, the list below filters instantly)
  • 33. Lemeno iOS and Android Screen Flow Messages (Event List View) (No Data Screens) Slide 8: If the messaging feature has been enabled for an event, here is where guests and the event organiser can start communicating with one another.
  • 34. Lemeno iOS and Android Screen Flow Messages (Event List View) ● Messages will be organized by Event Titles ● The most recent active conversations always move to the top of the list (regardless of any other details of that event.) ● This page will appear empty until: ○ A User has written to an event admin on a particular event then the event title will show and the User message will be in the next page. ○ An admin creates an event and has allowed messaging, then this listing will automatically show but with 0 conversations on the next screen (this’s in case the Admin would like to send broadcast to the guest list) ● Swiping left on each row will show: ○ Mute: stop notification on this event ○ Disable: disable messaging on this event all together ○ Delete: Delete all messages within this event (but keep messaging open to any other guests who may want to write)
  • 35. Lemeno iOS and Android Screen Flow Messages (Conversation List View) (No Data Screens) Slide 9: This event has no conversation yet. Send a message to contact the event organiser or other guests.
  • 36. Lemeno iOS and Android Screen Flow Messages > Message Board ● A single message board common to all confirmed and pending guests to an event where everyone can chat with everyone. ● Should mention when the conversation started (January 27, 2015). ● If the conversation splits across different days, the new date should show in the center and in between the messages where the day was split (See Whatsapp for reference) ● “Back” button goes back to screen “Messages” (Event List View) ● The user who is writing will appear on the right and in a yellow message box. ● Each chat window should start with the users name. i.e: “George says:”, and “Baher says:” with the rest of the message split on the next line.
  • 37. Lemeno iOS and Android Screen Flow Slide 10: Put your contacts into circles to make it easier to invite certain groups of people to an event. Circles (No Data Screens)
  • 38. Lemeno iOS and Android Screen Flow Circles ● To add a new circle, the user must pull the screen down which will reveal the space to add a new circle ● Sort by latest added circles first ● Swiping left on a circle name opens the contextual menu that allows: ○ Edit Circle Name ○ Delete Circle (delete confirmation prompt “Are you sure you want to delete”? ● By default, the app will come with a predefined set of circles (which the user can delete if he doesn’t want them). These circles are: ○ My friends ○ My family ○ Work colleagues ● Tapping on the right arrow of each circle will reveal the users within that circle (Discussed on next page)
  • 39. Lemeno iOS and Android Screen Flow Circles > Add New Circle ● The user should be able to pull down the screen to add a new circle with this demonstrated animation transition. i.e: The more the user pulls the screen down (from the previous screen), the more of this light purple background shows) until it loads fully into place. ● He can type in the light purple area which will replace the placeholder text (Add a new circle). The keyboard should have a “DONE” button to confirm the text entry. (max 35 characters) ● If the user taps on EDIT, then the name of the circle highlights within the row so he can simply type and replace the text there instantly.
  • 40. Lemeno iOS and Android Screen Flow ● Any time a circle has no users in it, this screen should show (i.e: When a user creates a new circle, or removes all users from an existing circle). He will be prompted to add users by checking next to their names. ● Once DONE is pressed, the user will be directed to the next screen “Circle > Details Page” Circles > Add/Edit/Delete Users in Circle
  • 41. Lemeno iOS and Android Screen Flow ● Search have the default search behavior of the contact list on the device (with real time results. i.e: As the user types, the list below filters instantly) Circle > Search
  • 42. Lemeno iOS and Android Screen Flow ● Lets remove the the rearrange icon (3 horizontal lines on the right). ● Swiping left on a name will allow the user to access a menu which will allow him to delete the user from that circle instantly. Circle > Details Page
  • 43. Lemeno iOS and Android Screen Flow Events > Mine (No Data Screens) Slide 11: Any event you’ve created will show up here, and the coloured bars on the left will show you whether they’ve been confirmed, still pending, or cancelled.
  • 44. Lemeno iOS and Android Screen Flow ● This tab shows all the events that the user is hosting ● Events are categorized by date (todays date, and flow chronologically) ● Each listing has a colored vertical strip to denote its status: ○ Green: The event is confirmed and on as planned ○ Orange: The event is pending the minimum required guests to join. ● Status icons: ○ Admin icon: If this event has been given admin rights to any of the confirmed guests. If yes, the icon goes from its passive (dim) state to a full colored state. ○ Repeat: If this event is a repeat event, the icon will go from its passive (dim) state to a full colored state. ● Swiping left on each will show a menu that allows the admin to: ○ Edit: Edit event details by going to the event creation page with all details already filled out ○ Cancel: To cancel the event all together and inform guests with a push and activity feed notification that it has been cancelled. Events > Mine
  • 45. Lemeno iOS and Android Screen Flow Events > Upcoming (No Data Screens) Slide 12: Any invitation you’ve accepted will show up here and becomes an upcoming event. Check your settings to decide on how you want Lemeno to do handle cancelled events.
  • 46. Lemeno iOS and Android Screen Flow ● This tab shows all the upcoming events that the user has confirmed attendance to. Sorted by the most happening soon first. ● Events are categorized by date (todays date, and flow chronologically) ● Each listing has a colored vertical strip to denote its status: ○ Green: The event is confirmed and on as planned ○ Orange: The event is pending the minimum required guests to join. ● Status icons: ○ Admin icon: If this event has been given admin rights to any of the confirmed guests. If yes, the icon goes from its passive (dim) state to a full colored state. ○ Repeat: If this event is a repeat event, the icon will go from its passive (dim) state to a full colored state. ● Swiping left on each will show a menu that allows: Actually I’m Out: Which will change the users attendance to an event and affect his flakiness rating (but to a lesser extent). Algorithm to calculate flakiness in this case to be defined here. “Lemeno Logic + Algorithms 150129” https://docs.google. com/document/d/1yXyzGDfZjBo7pmtdR-J- u5zeH6scYWX3CLbmmwjAuCs/edit?usp=sharing Events > Upcoming
  • 47. Lemeno iOS and Android Screen Flow Events > Past (No Data Screens) Slide 13: Any past events you’ve gone to will show up here. Check your settings to decide on how you want Lemeno to handle them.
  • 48. Lemeno iOS and Android Screen Flow Events > Past ● This tab shows all the past events that the user has attended. Sorted by the most recent soon first. ● Events are categorized by date (most recent date, and flow chronologically in reverse) ● Each listing has a colored vertical strip to denote its status: ○ Red: The event is done ● Status icons: ○ Admin icon: If this event has been given admin rights to any of the confirmed guests. If yes, the icon goes from its passive (dim) state to a full colored state. ○ Repeat: If this event is a repeat event, the icon will go from its passive (dim) state to a full colored state. ● Swiping left on each will show a menu that allows: ○ Remove: Which will allow a user to remove this completed event from his list.
  • 49. Lemeno iOS and Android Screen Flow Event Details > Invite not replied yet ● This page will always be a pop up that slides in from the bottom of the page. If the user taps on the X, it will slide out to the bottom and reveal whatever the previous screen was. ● In Event body description, please remove “More” and make it scroll in case the admin has typed in more than can show in this area ● On Event cover photo, please keep the black transparent gradient mask at the bottom so that the white text above always shows. ● User can tap on the map preview to open animate the map to become a full page view (shown in the next screen). By default, the pin of the location should be centered in that square. ● As long as the user hasn’t responded to the invite, the user can see the amount of time left to respond to this event. This time should count down (hourly) until the invitation expires. If no invitation expiry is specified from the event creation page, then this will count down to the event start time by default.
  • 50. Lemeno iOS and Android Screen Flow Event Details > Full page map view ● Tapping on left top corner to minimize map view back to event detail page. It must close in an animated way back to the original dimensions. In the top left corner, the user should be able to see a glimpse of the corner of the cover photo of the previous screen. ● Directions : will take user to google map with direction from User ”my location” to the event coordinates ● Location icon (in the top right) will always take the user back to the default view with the event location centered in the screen.
  • 51. Lemeno iOS and Android Screen Flow Event Details > Replied ● After the user has confirmed attendance to an event, the “time left to respond” will change to a reminder. By default, it will be 2 hours reminder before the event begins. ● Users can tap on this number to reveal other reminder options, such as: ○ 10 minutes ○ 30 minutes ○ 1 hour ○ 2 hours ○ 1 day ○ 2 days ○ 1 week ● Events should sync with the users mobile devices native calendar app unless they have turned off this option from the SETTINGS screen “Calendar Sync” ● Icons on the right in the grey background should always show in their passive (dim) display unless the permissions to access each has been granted to them by the event admin. ● Tapping on GUEST LIST will open up the guest list page (Screen Guest List / User view) ● +1/2/3 Allowed is not interactive ● Message icon will redirect the user to the MESSAGING section and directly to the conversation window so they can start typing right away. Once they leave this section, that conversation should remain in the messaging section. ● “Add Guests” will only show if the admin has made this user an admin also.
  • 52. Lemeno iOS and Android Screen Flow Event Details > Replied + Admin Privileges ● If the Event “Admin” (who created the event) made one of the guest as an Admin, then “ADD GUESTS” will be active. He can then invite his friends to the Event initiated by the original admin. ● Invitations sent to those guests will be in the format of : “User 2 has invited you to XYZ on behalf of User 1”. ● Both admins will receive push notifications of their response and news feed posts.
  • 53. Lemeno iOS and Android Screen Flow Event Details > Admin View ● Admin can: ○ EDIT: will direct Admin to event creation screen with all filled in data available so he can edit instantly. Editing anything will send a push notification and activity feed update to all guests that the admin has changed the details of the event. ○ REPEAT: Let’s have “REPEAT OFF” as shown in the screen shot. If repeat is on, the circle changes to a solid-fill blue with text in white ○ DELETE: To delete the event entirely. Deleting will send a push notification and activity feed update to all guests that the admin has deleted the event. ● Allows +1/2/3 shows the allowed plus guests for this event (If permitted) ● Message should be dimmed / inactive since the admin can’t message himself. ● Add Guests should be dimmed / inactive
  • 54. Lemeno iOS and Android Screen Flow Guest List / User view (No Data Screens) Slide 14: No guests have confirmed attendance to this event yet.
  • 55. Lemeno iOS and Android Screen Flow Guest List / User view ● 3 tabs: “IN” / “Pending” / “OUT” ● We have number indication next each tab title ● If the admin has specified a number of maximum guests, and 25% of those spots are still available, then a line at the bottom of the screen should show saying “Hurry. Only X spots remaining”.
  • 56. Lemeno iOS and Android Screen Flow Guest List / Admin view ● 3 tabs: “IN” / “Pending” / “OUT” ● We have number indication next each tab title ● The default behavior is: all guests marked as attended once the event completed (i.e: checked box or empty box have the same value). ● If the admin double taps on a checkbox, it turns into an X which means the user said they were coming (they were confirmed in the IN tab) but never came to the event. This bares maximum flakiness for that user. ● If the admin has promoted a guest to become an admin also, that user will get an admin icon next to their name and their status will change the number of confirmed guests from that user. This number should show in the IN tab as an addition to the original admins confirmed guests ● Sliding on each name/row will show 2 options: ○ Make Admin / Remove Admin ○ Uninvite
  • 57. Lemeno iOS and Android Screen Flow Guest List: Search (No Data Screens)
  • 58. Lemeno iOS and Android Screen Flow Guest List: Search ● Search have the default search behavior of the contact list on the device (with real time results. i.e: As the user types, the list below filters instantly)
  • 59. Lemeno iOS and Android Screen Flow Create Event > What ● Tap on camera icon to take a new picture or select one from the camera roll ● Event title max characters: 30 max ● Event description : No max characters.
  • 60. Lemeno iOS and Android Screen Flow Create Event > Where & When ● The tabs should animate quickly to open and close (where & when) ● Tap on the pin icon to add a location ● Note on this location: 120 character limit ● Start Date: Tap to open date/time selector: Note: The user should not be able to select a date in the past. ● End Date: tap to open date/time selector. Note: END DATE shouldn’t allow the user to place the end date before the start date, and no date from the past. ● Invitation Expiry Date: Date picker to show when the entire invitation will expire. i.e: If no one responds before the deadline then it disappears from their “New Invites” ○ Don’t allow users to add Expiry in the past ○ Don’t allow users to add Expiry after the “start date” (allow to add Expiry before “start date” and not after “start date”)
  • 61. Lemeno iOS and Android Screen Flow Create Event > Location ● Same as Uber‘s location selection where the pin is always centered, and users can move the map around behind the centered pin. ● Search: will show results nearby location only based on User current location
  • 62. Lemeno iOS and Android Screen Flow Create Event > Date/Time Selector ● Can we use native datepicker and add theme frame on it ● Don’t allow to create event in the past ● Don’t allow to create “end date” before “start date” ● Don’t allow to add “expiry date” after “start date”
  • 63. Lemeno iOS and Android Screen Flow Create Event > Who ● By default, the count will be “None” but will later will populate with the total number of invited guests. ● Admin will need to tap on the “right” arrow to begin inviting guests
  • 64. Lemeno iOS and Android Screen Flow Create Event > Who > Invite Guests ● Admin can scroll down the list and tick who he would like to invite, or he can type in contact names at the top.
  • 65. Lemeno iOS and Android Screen Flow Create Event > Who > Invite Guests ● Typing in a contact name will automatically filter the contacts below in real- time. Tapping on a friend from that list will automatically load the entire contact list again. i.e: The user shouldn’t have to delete his entry to go back to the full contact list again.
  • 66. Lemeno iOS and Android Screen Flow Create Event > Who > Invite Guests ● Alternatively, the admin can tap on the circles tab (which should open in an animated transition) and allow the admin to invite a circle ● Selecting a circle will add all the individuals of that circle in the summary of total invited guests (as seen on screen 52). i.e: The circle name itself should not show.
  • 67. Lemeno iOS and Android Screen Flow Create Event > Who > Invite Guests ● The guest count will now show the total invites guests (as opposed to “none” as shown in screen 48). ● This screen will show all the guests who have been invited by their names (i.e: Even if they were invited by selecting a circle, their names show here). ● Lemeno users will appear in grey. ● Non-Lemeno users will appear in red. ○ When the admin goes to send this invite, he will get a notification letting him know that X users are non-Lemeno users and will receive their invite by SMS. He can either then choose to “Edit Guests”, or “Proceed’ which will send the text messages as : “User 1 has invited you to an event on Lemeno. To see your invite, please download Lemeno from XXXX, and sign up using the YYY phone number”. Have fun!” ● The “Send” button at the top should now not be dimmed/inactive, but rather full color and ready to send out. This happens when at least 1 guest has been added to an event.
  • 68. Lemeno iOS and Android Screen Flow Create Event > How ● Animated tab transition. “Expand and collapse transition” ● Min: numbers typing pad ● Show error notification if user add 0 in “Min” and “Max”: “You can not set 0 as and an entry” ● Allow + guests: Dropdown showing only 4 options: ○ None ○ +1 ○ +2 ○ +3 ● Allow guests to view guest list: Drop down showing only 2 options: Yes (allows guests to view guest list) No (disabled invited guests from viewing guest list) ● Repeat every: Drop down showing (similar to Google native Calendar app): ○ Every day ○ Every day ○ Every week ○ Every month ○ Every Tuesday (or whatever day it currently is) ○ First Tuesday of every month (or whatever day it currently is) FYR https://www.dropbox.com/sh/bsjglwg2eatedg5/AADG8d6j9T7lsKvTM03cx-fWa?dl=0 ● “Declined Invitation Alert” will inform the admin every time an invited guest declines an invitation. This will then load a pop up that will allow him to “Replace” (invite someone else. Link to screen 49), or “Ignore”.
  • 69. Lemeno iOS and Android Screen Flow Settings ● Calendar Sync ○ Slide Right: Enabled (In Green) ○ Slide Left: Disabled (In Red) ●
  • 70. Lemeno iOS and Android Screen Flow About ● ●
  • 71. Lemeno iOS and Android Screen Flow About/Contact US ● SEND to submit this as an email form to the admin of the app (We require AA email) ● layover notification to inform the user of the status of his submission ○ Success: “Thank you for reaching out to us. We will get back to you as soon as possible ○ “Fail”: Ooops. Your message didn’t go through. Please try again!
  • 72. Lemeno iOS and Android Screen Flow FAQ List of FAQ’s can be found here: https://docs.google.com/document/d/1YIwFABi9TCQ- g7QTjvISTh2D8JTV7aO8FVAz4UpnJbc/edit?usp=sharing
  • 73. Lemeno iOS and Android Screen Flow Notifications ● Turning ON/OFF “All Notifications” will disable/enable all the options below.
  • 74. Lemeno iOS and Android Screen Flow Event settings ● Past Events ○ Remove after 1 day ○ Remove after 1 week ○ Remove after 1 month ○ Remove after 1 year ○ Never remove, until i delete (Manual) ● Cancelled Events Keep until event begins Keep until I delete
  • 75. Lemeno iOS and Android Screen Flow Account page ● ●
  • 76. Lemeno iOS and Android Screen Flow Account page ● Phone number should show the registered phone number on Lemeno ● Service: For now, all users will be a “Lifetime” membership until further notice
  • 77. Lemeno iOS and Android Screen Flow Change Number ● User will receive new verification code on his new sim number and he needs to input the code number for validation ● When users enter the new country code and phone number, the validation process should happen again. In this case, the old number becomes inactive, and the new number replaces this user account. No events should be deleted or lost in this process!
  • 78. Lemeno iOS and Android Screen Flow Delete account ● User will receive new verification code on his new sim number and he needs to input the code number for validation ● Upon successful termination, all details of this user and his events should be deleted from the server ● Termination pop up should take the user back to the first sign up screen as if this user just downloaded the app
  • 79. Lemeno iOS and Android Screen Flow Delete account ● User will receive new verification code on his new sim number and he needs to input the code number for validation ●
  • 80. Lemeno iOS and Android Screen Flow Privacy ● Account visibility ○ Slide Right: Visible (In Green) ○ Slide Left : Invisible (In Red) ● Shows the total number of blocked users ● Profile Photo: ○ Visible to everyone (to whoever has this user on his phone book) ○ Visible to my contacts only (both “User contacts” must be on each others phone books) ○ Visible to no one ● Status: ○ Visible to everyone (to whoever has this user on his phone book) ○ Visible to my contacts only (both “User contacts” must be on each others phone books) ○ Visible to no one
  • 81. Lemeno iOS and Android Screen Flow Blocked Users (No Data Screens)
  • 82. Lemeno iOS and Android Screen Flow Blocked Users
  • 83. Lemeno iOS and Android Screen Flow ● User can update his Photo here ● layover notification to inform the user of the status of his submission Success: “Thank you, your data has been sent successfully.” “Fail”: “Ooops. Your data didn’t go through. Please try again!” ● User can edit: Photo (tap to choose from album on mobile device) First Name Last Name E-mail Status ● Button to “Save Changes” should have tap effect Profile
  • 84. Lemeno iOS and Android Screen Flow Screen notification ● ●