Ryland King πŸ›  Profile picture
@stackbit

Mar 8, 2019, 23 tweets

Creating mocks to feature our partners on Surf Trip List. I’ll update here every 30 mins with a photo of where I’m at.

0 Mins πŸ‘‡πŸΌ

30 Mins πŸ‘‡

1 hr πŸ‘‡

1 hr 30 mins πŸ‘‡

First minimal sketch is starting to take form.

I'm stuck on how people can navigate the map.

World view is fine partner locations bc we have <100.

But if you add surf spots to world view map becomes a cluster fβ€”.

Need filter by continent/region...(?)

2 hr πŸ‘‡

Splitting into Map and List view.

List will be easier to launch ASAP. Map can come next.

Got idea by going back and reviewing how Ikon Pass' website works.

Things still feel very open ended in my brain. Need a better vision of end product.

2 hr 30 min πŸ‘‡

Trying to keep things simple. Think we can use Partner Destination pages also as our Alerts # Show page.

People can see all the Partners within each Partner Dest at any time.

It shows on our Alerts # Index page when cheap flight is available.

3 hr πŸ‘‡

Need to talk with backend dev.

Want to ensure changing Partners # Index to Partner Locations # Index is possible and within scope.

Slacked & explained it in our GH Issue. Provided list of all partner locations with coords (made 2-weeks ago).

Began Partners #Show

4 hr πŸ‘‡

Chatted with Dylan.

We need to attach a Partner to their relevant Destination. (The missing piece!)

Once we do that, we can create the Partner Locations # Index List page using our existing Destinations (They were the same!)

This page:

Then what we thought was Partners # Show page actually becomes a Destination # Show page.

Within it are our flight alerts, stay and surfboard pick up partners.

This page...

That page over takes our old concept of creating a new Alert Page every time we find a cheap flight.

Instead, now we have one page for each destination that just updates whenever we find a cheap flight to that destination. πŸŽ‰

Four hours in and I finally feel like I've got a set direction! πŸ¦Έβ€β™‚οΈ

Now it's time to create the NEW Destination # Show page that updates when we find new flights or get new partners.

4.5 hr πŸ‘‡

Finally, for the first time you can actually see and feel the flow!πŸ•Ί

This whole thread probably made no sense until looking at these images.

Next: Clean up Destination # Show mock so it's relevant to each account_level.

Breaking for lunch, a walk and a podcast. πŸ₯—πŸšΆβ€β™‚οΈπŸŽ§

Starting back up. Wifi is down.

#reallife

Giving up on Wifi at home. Walking to coffee shop.

Ok, finally done.

Here are the final wireframes!

Here's the wireframe in checklist format:

Here's my communication with & checklists for Dylan & Matt in the GH Issue.

This whole process took longer than I expected.

I could have easily built 2 new pages: a list of partners & a page showing each of their details

But what surfers care for first is - Finding where to go

Once they see that, then they want to know about flights, stays, boards..

It was hard to transition my mind from "What we planned to build" to "What our customer would want us to build"

I came up with two pages:

Page 1. Lists all the destinations we support, and
Page 2. Shows the flights, stays and board partners available at each destination

This is a big deal for us because we no longer need to create a new Deal page every time we find a flight.

Instead these pages last forever. They are updated anytime we find a cheap flight or add a new hand-selected partner. We'll likely add local tips & more to these pages too

I tried hard to keep my devs in mind by creating a mock that used their existing work and fit as easily as possible with the existing code.

Thinking like an engineer while building this was probably the biggest slow down.

But!...

I'm 100% sure that this extra thought will take out numerous "back-and-forth"s as the build it.

Chatting with Dylan (backend) was probably one of the most helpful things I did.

And that's it for the mocks. I'll post links once this is live! πŸ‘‹

Share this Scrolly Tale with your friends.

A Scrolly Tale is a new way to read Twitter threads with a more visually immersive experience.
Discover more beautiful Scrolly Tales like this.

Keep scrolling