UX/UI design | web design

SOCIALER
Redesigning for the power of first impressions

Before and after:
The real attraction comes by showing who you are

Socialer is a cozy coliving and coworking space tucked away in a quiet neighborhood of Chiang Mai, offering a peaceful retreat for travelers and digital nomads. Unlike the bustling hostels or impersonal hotels, Socialer provides a blend of homey vibes and an easy-going community atmosphere. Guests get a comfortable stay and plenty of opportunities to meet like-minded people through social events and laid-back meetups.

The outset: A generic approach
The main issue with their old website was that it didn’t capture the essence of the space they wanted to showcase. It had generic images and followed a very unoriginal display of the Don’t get me wrong, they had plenty to offer, but after visiting the space, I realized the website fell short—even though it was clean and informative. It simply didn’t reflect the true atmosphere of Socialer.

Capture the essence of the space to conveying the atmosphere of Socialer through the website.
Facilitate an intuitive booking process so the users can book directly.
Balancing a minimal design and providing all the necessary information.

The target: Capturing the authentic essence
Socialer's mission was to project an environment of collaboration and tranquility, inspired by a minimalist Japanese style that emphasized cleanliness, focus, and creative flow. The existing website didn’t convey these elements effectively, which is why they sought a redesign to better attract visitors. They also wanted to encourage more direct bookings by offering clear, comprehensive information to help users feel confident in making a reservation. My task was to ensure the site not only captured the spirit of the space but also made the booking process seamless, with a strong visual call-to-action and an intuitive flow.

My role in the project involved UX/UI design and no-code development, with the goal of creating a website that immediately conveyed the uniqueness of the space while making it easy to book a stay directly. I wanted users to feel connected at first glance, showcasing Socialer’s inviting community, beautiful co-living space, and events that foster networking and friendship.

Positive client feedback and expectations met

The client was thrilled with the design, appreciating how it captured their core values of community and tranquility, while giving the site a fresh, modern feel.

Project continued independently

After the project was put on hold, I decided to finish the design on my own and publish it. This allowed me to showcase the final work, attracting new clients seeking similar solutions.

Attracting new collaboration opportunities

As a result of the published design, I gained interest from other businesses looking for modern, minimalistic websites tailored to their unique businesses.

Research and insights:
What makes a traveler stay

Competitor analysis
I performed a competitor analysis of seven co-working/co-living spaces from not only direct competitors from Chiang Mai, but also other successful co-livings in Bali and Tulum, and ran usability tests on the original website and also on my prototypes to gather valuable feedback.

Strong visual storytelling in the hero

Showing real images of the space and the community immediately connects with visitors. This helps potential guests feel the vibe and atmosphere, rather than relying on generic stock images.

01
"Book Now" CTA in the main banner

This makes the booking process intuitive, guiding visitors to take the next step without unnecessary clicks or distractions.

02
Information about the local neighborhood

These users often seek details about the area they’re staying in. Including information about nearby restaurants, cafes, transport options, and directions. This helps create a more complete picture of what to expect in the surrounding.

03

User research: Interviews and user testing
Aditionally, to better understand the needs of Socialer's target audience, I conducted interviews with digital nomads, backpackers, and travelers. These are the key insights:

Community-driven spaces

Digital nomads highly value peer recommendations and word-of-mouth, preferring spaces that offer both social interaction and a conducive environment for productivity.
Balance of work and socializing

While social connections are important, users want separation between work and social activities, ensuring a productive atmosphere that’s not too quiet or too chaotic.
Mismatch in Design

The playful design felt out of sync with the more conservative tastes of Orygen's older audience.
Visual and spatial preferences

Clean, spacious, and well-lit environments are highly desirable. Users want to see actual images of the space that reflect its atmosphere and ambiance, creating a sense of security and inspiration.

User persona
Emma is an experienced digital nomad who knows exactly what she’s looking for. However, sometimes the timing or the results from a quick Google search don’t meet her needs. She is highly organized and focused on her work, so she needs a calm, quiet space to get her tasks done. After spending so much energy working, she also wants to recharge through social interactions, sharing experiences, and engaging in fun activities.

User journey
Emma can’t afford to waste time and needs to find a place that checks all her boxes. Coffeeshops are a good option, but they close too early. Working in a hotel room makes it hard to concentrate, and paying daily for a coworking space feels like she’s paying for two separate spaces when she could have everything in one place. When she searches for "coliving spaces in Chiang Mai," she finds Socialer, but the website doesn’t provide enough information at first glance, leaving her frustrated because she doesn’t have the time to search through it.

Research isn’t just about hearing what users say they want—it’s about uncovering what they really need so we can solve their problems with experiences that truly fit their lifestyle.

Adriana

Design process

Showing the real Socialer space
Considering the insights gathered, particularly how digital nomads prioritize comfort and clarity, I approached the design by ensuring that users could get a full understanding of what Socialer offers at a glance. The goal was for them to instantly feel the minimalist tranquility and sense of community the space provides.

Bento-style layout

Instead of using a typical stock image in the hero section, which often gave the impression of a transit area like an airport or station, I opted for a bento-style layout that immediately showcased Socialer’s three core pillars: accommodation, coworking space, and social events. These were the primary interests highlighted by the user research and perfectly aligned with Socialer’s mission.
Highlighting the core words

For the content, I focused on making the coworking, coliving, and events clearly visible, and I incorporated UX writing that gave potential guests practical information upfront, such as nearby services, ways to communicate with Socialer, and a brief description of the space.
Concise and minimal

I started by structuring the information to give a clear path of the disposed information. Playing with large pictures, emphasising the important words to match the pictures and applying the black and white with yellow accent color palette made easier to create a minimal and clean style.

Connecting the landing page to the rest of the site
The main challenge here was integrating the landing page into the existing site map. I had to ensure the landing page communicated all the essential information while still fitting seamlessly with the existing site. This involved balancing the amount of content while maintaining a simple and effective navigation flow.

Prototyping and feedback
I started by creating low to mid-fidelity wireframes in Figma to showcase the structure of the information and give the client a clear understanding of how everything would be laid out. hough the prototypes were primarily for content distribution, the client was positively surprised by the modern and fresh look, which aligned with the current trends in similar spaces. Once the structure was approved, I moved to Tilda, applying Socialer's color palette and emphasizing large images and minimal text to convey the right atmosphere.

After presenting the prototypes, I conducted several usability tests, which validated the design decisions, particularly the focus on clear, immediate access to information and visually engaging content.

Final design solution

I chose Tilda for the final development because it integrated modern animations and customizable components that matched my designs from Figma. The platform’s built-in animations added an interactive layer to the user experience, enhancing the overall appeal without detracting from the minimalist aesthetic.

I thoroughly reviewed the responsive design across devices, ensuring that the layout was functional and visually appealing on mobile, tablet, and desktop. Tilda’s ability to adjust components per device width was especially helpful in maintaining the experience across different screen sizes.

As for SEO, my focus was on creating a clean and structured site, that inherently supports search engine optimization, but this wasn’t the primary objective of the project.

Click here to visit the web life!

Results:
Message received

This project underscored the importance of truly understanding the needs of the target audience. By speaking directly with people and uncovering their concerns, I discovered details that might have otherwise been overlooked or assumed.