#5 Bubble Makers: Your app looks better than mine
#5 Bubble Makers: Your app looks better than mine
bubble tips for no-code makers
Hi Bubble Makers,
Wrapping up a great month, the first of many for this newsletter. Thanks for being early readers!
Just like last week, I’ve included a short question in each section. DM me on Twitter or reply to this email if you want to chat about any of them :-)
This newsletter issue includes:
One section for Bubble beginners
One section for more experienced Bubble makers
One cool app built with Bubble
One tweet related to Bubble that I found inspiring and helpful.
The Beginners Bubble
A couple of months ago, I built Spotify Tabs, a simple web app to get guitar tabs & tutorials from your Spotify playlists. I created a completely different User Interface for mobile and desktop.
The reason I built two different UIs for the same app is that it’s hard to make an app look well for all screen sizes, especially if there are a lot of elements on the page.
If you have problems with responsiveness, creating two different pages might be easier than figuring out how to make one page responsive for all case scenarios. All you need to do is double click on the desktop page and select one of your other pages to be its mobile version.
For Spotify Tabs, I created:
myplaylists —> A desktop page, responsive for big screen sizes.
mobile_myplaylists —> A mobile page, responsive for all mobile screen sizes. I didn’t worry too much about tablet sizes, because I knew that only a handful of users would visit the page from their tablets.
Mobile-first or desktop-first? What are you building?
The Makers Bubble
You’re reading Bubble Makers, so there’s a great chance that you have a project in the making. Tip of the week is to just launch.
As makers, one of our main priorities is to collect user feedback as soon as possible to iterate and make better products.
We have just seen how you can have a different mobile and desktop version for the same webpage, but to get feedback you probably don’t need to nail both versions. Think about the most common use case for your target users and build the one that fits it better. You’ll be able to see how they use it (or don’t use it!), iterate fast and launch version 2.0.
You might be thinking… “Ok, I’ll build the desktop version, but what about all the users that will visit my page from their phones? Am I going to lose all that traffic?”
Not necessarily. Spend 5 minutes building a very (very) simple mobile version of your web app and redirect all users to that page as we’ve seen in the Beginners bubble. In the mobile version, you can explain what your working on and collect emails so that you can notify your users once the new version is ready.
That is exactly what we did for Pheedback when we were looking for beta users. We’re now working on a new UI after seeing how people actually used the app. That first feedback is very valuable and you sometimes don’t need to build a mobile version of your app to collect it.
Have you ever launched without a mobile/desktop version?
App of the Week
This week’s app is Buildcamp, an amazing looking website full of Bubble tutorials and resources. Gregory and James are creating a whole universe around Bubble and often share tips & advice on how to create good Bubble apps.
Mokhachane, a great maker and avid reader of this newsletter, asked me yesterday how Buildcamp could look so well on all devices. This is the perfect example of why it makes sense to have two different versions of the same page.
Watch the page layout, background and menu change when you switch from desktop to mobile:
If you see a Bubble app that looks amazing on mobile and desktop, there is a great chance that you’re looking at two different pages.
Have you seen any Bubble app where you couldn’t figure out how something was made?
Tweet of the Week
Even though I like coding, I agree with Greg here. Coding can be quite hard, especially at the beginning.
Building a “Hello, World!” HTML page is not nearly as exciting as building a clone of your favourite website. When I was a child, motivation was one of the main factors that made me learn faster, so I’m sure being able to build full web apps would have got me hooked.
Having said this, schools will probably need to teach programming, in general. To create a complex web app you still need to understand the logic behind each workflow, think about data relationships, etc. In the end, to be a good no-coder you still need to know how to program… only without code.
Do you know any schools teaching no-code tools these days?
I hope you enjoyed this issue as much as I enjoyed sharing what I’m learning.
If you want to talk a bit more about one of those questions, you can DM me on Twitter or reply to this email. Thanks for reading and happy holidays!