A few weeks ago I offered to refactor a Bubbler’s app. A couple of people took me up on that.
Here are some of the results.
SwipeyCat
by @ken
Before
Landing
Challenges
- Color combination.
- Tinder pile
- Plugin is a tough to work with.
- Not responsive.
- Load times were very slow (Bubble has issues some fixes in the meantime that sped that up).
- On mobile, it could not load or crash entirely.
- Top 5 Cats
- Feature didn’t emphasize the pictures of the cats - a key point of the user journey.
- This feature might be missed entirely because you had to scroll down.
- Sliding navigation panel
- Didn’t gel with the rest of the app.
- Tough to maintain. Each option is a different workflow. Over all the pages where it is applied.
- No icons.
- No character.
- Not reusable on desktop.
Blog
- Hard to read title.
- Blog content already appears in the main body.
- Pictures not responsive.
User Dashboard
Blog Admin
Admin Dashboard
- Hard to read.
- No search.
- Stats not clear.
- No details on who recommended whom.
After
Landing
- It does one thing only.
- White background puts the picture of the cats in evidence.
Top Cat
- Big pictures.
Sliding Navigation Panel
- Super simple to maintain via Option Sets.
- 1 workflow for any and all option sets.
- Fully customizable for different types of users: not logged in, member, admin.
- Icons gives each option character.
- App colors moved to the sidebar.
- Slight animation of the logo gives it a tad of life without overwhelming.
Blog
- Fast loading
- Pictures resize to fit small or big screen.
- Comments are fully expanded at the bottom.
User Dashboard
- Large images.
- Easy to see vote count.
- Beautiful add photo popup.
- Slick delete confirmation popup.
Blog Admin
Admin Dashboard
- Clean overview.
- Stats.
- Searchable.
- Can see big pictures that the user has uploaded.
- Possible to view user’s recommendations.