Create a Clubhouse-like profile picture using Swift

In this brief article, we'll discuss how we can change the corner radius rounding method to create smooth curves, instead of circular.

Alcivanio (Swift)
Bootcamp

--

iPhone with AppStore opened in the main page of the app Clubhouse. Wired earphones next to the iPhone

Clubhouse shortly became one of the most popular apps on the AppStore. I would say there's many reasons for the social network growth, one of them, no doubt, is their easy to use interface. Not only easy to use, but also sophisticated and beautiful.

Profile page of Alcivanio Alves on Clubhouse. 21 followers and following 56.

I am a big fan of great user interfaces, and my friends know that. Two of my developer friends reached out, commenting on Clubhouse’s profile picture layout. They were particularly intrigued because that profile picture looks at the same time as a square with rounded corner, and almost like a circle, with squeezed borders.

This type of shape is actually a rectangle. The only difference is the type of curve it implements for its corners rounding. Instead of the regular (circular) one, it uses a continuous implementation. The continuous curve is a more smooth transition for the 'circle' corner to the rect share of the borders.

--

--

Alcivanio (Swift)
Bootcamp

Computer Engineer + iOS Engineer. I am interested in Swift, Kotlin, Firebase, Data Structures, ASO & On Solving Real World Problems.