Bambu native prototype

Scope

The app experience should be made up of these distinct parts:

1. The icon — should catch your eye, not sure if it should look like Bambu or should look like your organization
2. The launch state – waiting to experience Bambu the first time and every time should be delightful and inspiring, not annoying, broken, confusing or draining
3. The list view - like all other conversation app experiences, I should be empowered to engage my spatial reasoning and make a decision about what matters to me right now
4. The navigation – should follow Apple’s guidelines as closely as possible while still retaining the elegance, simlicity, and uniqueness of Bambu’s brand experience
5. The menu - the list of available options for changing the content will help me contextualize how the content is relevant to me and empower me to control how I work through it and make full use of the experience
6. The profile - I need to know how I am represented in this app to my company so remind me of what profiles I have connected, what networks I am still able to connect, what email is associated with this app, what role I have in a way that is meaningful to me, and what my performance has looked like compared to company averages
7. The share actions - the when, where, what, and how are impacted by high-level design decisions about doing our own thing, double-dipping, and complexity of the composition view
8. The reading view - rich, immersive, readable, and highly functional …
9. The composition view - this is wide open for iteration … Why do we do this? · accurate, controled share counts? · “via Bambu” attribution?
10. The scheduling view - The current triple-tap selection model seems strong. To whom can we compare?
11. The post options view - The current double-tap selection model seems strong. To whom can we compare?
12. The submission state -
13. The successful submission state -
14. The story list is empty state -
15. The failed submission state -
16. The push notifications - need to write business rules for these

Checklist

[]

Thoughts

• Question: Can we use the Tab Bar for our existing options and share action currently positioned along the bottom of the viewport?
• Fixed story list item height vs. variable height
• Excerpt in story list item vs. no excerpt
• Custom compose vs. native action sheet · Question: What apps have custom compose?
• “I am publishing this message about this story to this [account (person’s face)] on this [social network (brand icon)] either right now or in the future.”
• Heating up / on fire lights up the story like NBA Jam, say 3 shares in 10 minutes, keeps flame as long as no more than 5 minutes pass without another share
• Instead of gamefication, we could expose names of those who have recently shared or all-time shares, cater to the same instant gratification visual feedback
• We can definitely beef up the successful submission state, instead of a lame text only growl alert, how about we fire a new full screen that gives you company-wide share statistics for that story, other team members who have shared that story, and specific challenges like “share 2 more stories to beat today’s company average” or “x shares left to badge/incentive”

Research

• “Maybe we do a tabbed interface in compose to accomodate publishing to multiple networks at once.” – Kris (paraphrase)
• “Compose is hard.” – Sundeep
• Kris favorite reading experience is Pocket because of saving to my pocket, I get value out of my list with title, source, some attribution like Trending and Best Of, light imagery, actions (6, tag, complete, favorite, love, trash, share) on the surface via swipe … we are at an inherent disadvantage because Pocket has “the entire world” and our customers struggle to source content
• Kris favorite sharing experience might be Buffer, I don’t have a lot of examples that don’t use native … if we push to a share sheet, we lose
• If it only exists in our native app and not anywhere else, that needs to be a very conscious decision

Decisions

• According to Apple Human Inteface Guideliness, a Tab Bar positioned along the bottom of the viewport is for “peer categories of content or functionality”, not for displacing distinct navigation items. We should try new positions for our menu and share actions.

Reading

• List view :+1:
• What about story management? Marking as complete or read or archived or “go away”, etc. as opposed to only sharing or scheduling
• What about increasing context on the surface?

Sharing

Information

Links

• Designing for iOS 9 / design+code
• Bars / UI Elements / iOS Human Interface Guidelines / Apple
• iOS Human Interface Guidelines / Apple

Pull Quotes

• “Users should always know where they are in your app and how to get to their next destination.” — Apple, HIG · Navigation
• “Use a navigation bar to give users an easy way to traverse a hierarchy of data. The navigation bar’s title can show users their current position in the hierarchy; the back button makes it easy to return to the previous level.” — Apple, HIG · Navigation

Inspiration

• Native Apps Brainstorming / Kris / InVision Board
• UI8 Wireframe Kit / Creativedash / Dribbble

Services

Adorable Avatars Free, square avatars that look like little, colorful monster faces. The best part of the service is that when you pace a unique string at the end, it will always serve the same image so the avatar is always the same for that user. Example: https://api.adorable.io/avatars/200/matt@sproutsocial.com.png

~~PlaceIMG — Free, random placeholder images with simple URL-based size and category configuration. Example: https://placeimg.com/200/200/tech~~ Too damn slow and keeps choking my page reloads in development!

LoremFlickr - Better than because it supports query strings which will generate different images on the same page at the same size.

Enable web inspector for Safari on iOS

iOS > Settings > Safari > Advanced > Web Inspector