1993 is an innovative design studio, where we blend artistic elegance with a narrative soul. Our work is a symphony of visual art, design, technology, and storytelling, crafted with a forward-thinking vision.
I was honoured to give a talk at Web Zürich last Friday, sharing the story of 1993 Design Associates, and our vision of designing without boundaries. The evening was made unforgettable by the many inspiring conversations afterwards.
A big thank you to Robert Einars and the Web Zurich team for hosting such an incredible meet-up event! If you're passionate about all things relate to design and development and want to connect with like-minded innovators, their community is one you shouldn’t miss.
#WebZurich#DigitalInnovation
𝐀 𝐛𝐫𝐞𝐚𝐤𝐝𝐨𝐰𝐧 𝐨𝐟 𝐨𝐮𝐫 𝐢𝐧-𝐡𝐨𝐮𝐬𝐞 𝐩𝐫𝐨𝐣𝐞𝐜𝐭, 𝐁𝐨𝐧𝐬𝐚𝐢 🌳 (𝐏𝐭1)
𝘏𝘰𝘸 𝘥𝘰 𝘔𝘪𝘥𝘑𝘰𝘶𝘳𝘯𝘦𝘺, 𝘕𝘰𝘮𝘢𝘥𝘚𝘤𝘶𝘭𝘱𝘵, 𝘍𝘪𝘨𝘮𝘢, 𝘢𝘯𝘥 𝘞𝘦𝘣𝘧𝘭𝘰𝘸 𝘱𝘭𝘢𝘺 𝘵𝘩𝘦𝘪𝘳 𝘳𝘰𝘭𝘦𝘴 𝘪𝘯 𝘵𝘩𝘪𝘴 𝘱𝘳𝘰𝘤𝘦𝘴𝘴?
The idea for Bonsai began with a simple goal: creating a website that immerses visitors in the atmospheric vision of our game concept. Inspired by the unsettling aesthetics of 𝐓𝐡𝐞 𝐁𝐚𝐜𝐤𝐫𝐨𝐨𝐦𝐬, Bonsai is imagined as a first-person horror exploration game where memory and illusion blur in a surreal labyrinth. But here's the challenge: 𝒉𝒐𝒘 𝒅𝒐 𝒘𝒆 𝒄𝒓𝒆𝒂𝒕𝒆 𝒂𝒍𝒍 𝒕𝒉𝒆 𝒂𝒓𝒕 𝒂𝒔𝒔𝒆𝒕𝒔?
𝐌𝐢𝐝𝐉𝐨𝐮𝐫𝐧𝐞𝐲: 𝐂𝐨𝐨𝐤𝐢𝐧𝐠 𝐂𝐨𝐧𝐜𝐞𝐩𝐭𝐬 🍽️
To bring our ideas to life, we used Midjourney to generate surreal visuals. Simplicity worked best—using /𝒃𝒍𝒆𝒏𝒅 to combine image ideas. We focused on:
- Dynamic, fluid flora and bio-aesthetics
- Monochromatic tones with specific lighting for mood
- Balanced, spacious, and dreamlike compositions
It took 400 iterations of blending and refining to get it right! Blending no more than 3 images at a time helped us achieve cohesive and stylised results.
𝐍𝐨𝐦𝐚𝐝𝐒𝐜𝐮𝐥𝐩𝐭: 𝐅𝐫𝐨𝐦 2𝐃 𝐭𝐨 𝐈𝐧𝐭𝐞𝐫𝐚𝐜𝐭𝐢𝐯𝐞 𝐇𝐞𝐫𝐨 🎨
We brought the generated images into the design stage in Figma and selected the strongest one for the hero design. Yet, something still felt missing.
Static hero images didn’t feel immersive enough, so we turned to 𝐍𝐨𝐦𝐚𝐝𝐒𝐜𝐮𝐥𝐩𝐭. Using the chosen hero image, we transformed it into a custom 3D model. This allowed us to integrate subtle, interactive elements, creating a more dynamic experience for users.
___
In the next post, we’ll dive into our Webflow development process and share the full site showcase. Stay tuned!
(𝘗𝘚. 𝘞𝘦 𝘢𝘳𝘦 𝘯𝘰𝘵 𝘢𝘤𝘵𝘶𝘢𝘭𝘭𝘺 𝘮𝘢𝘬𝘪𝘯𝘨 𝘨𝘢𝘮𝘦𝘴. 𝘐𝘵’𝘴 𝘫𝘶𝘴𝘵 𝘢 𝘨𝘳𝘦𝘢𝘵 𝘵𝘩𝘦𝘮𝘦 𝘧𝘰𝘳 𝘢 𝘴𝘩𝘰𝘸𝘤𝘢𝘴𝘦 𝘸𝘦𝘣𝘴𝘪𝘵𝘦 😉)
In early August, we were approached by Sketchin to explore potential collaboration on one of their key projects, specifically aimed at gathering insights related to the Global/China market.
Throughout August and September, we have undertaken comprehensive desk and field research, including interviews and surveys, and delivered a detailed presentation deck with our findings. While we are unable to share specific details due to confidentiality agreements, we can say that partnering with another design studio in this capacity has been a unique and valuable experience for us.
We’d like to give a shout out to the incredible team at Sketchin who made this journey so rewarding—Gabriele Demarin, Federico Rivera, Federica Papa, iarno castellani, Gabriele Ghidini Pini, Alice Brovelli, Matteo Polato, and everyone who contributed. It was truly a pleasure to work with such talented individuals! We look forward to what the future holds for this collaboration.
Here’s a small 3D scene we created to celebrate this collaboration🎉
#DesignCollaboration#MarketResearch#Sketchin#DesignStudios#Teamwork#ChinaMarket#1993DesignAssociates
𝗪𝗲𝗯𝗳𝗹𝗼𝘄 + 𝗞𝗼𝗱𝗲𝗹𝗶𝗳𝗲 + 𝗚𝗹𝘀𝗹𝗖𝗮𝗻𝘃𝗮𝘀? Take a look at our in-house project to see what else Webflow can do 💅
https://lnkd.in/guwSKAjB
𝗣𝗿𝗼𝗷𝗲𝗰𝘁 𝗦𝘁𝗼𝗿𝘆:
𝗞𝗼𝗱𝗲𝗹𝗶𝗳𝗲 is a real-time GPU shader editor. We played around with this JS library called 𝗚𝗹𝘀𝗹𝗖𝗮𝗻𝘃𝗮𝘀 to load the shader into the background of our site on Webflow.
SuperHi'stutorial is absolutely helpful for getting started, but we still have some puzzle pieces to figure out when it comes to integrating with Webflow. (It's really frustrating not knowing what that console error means every time)
Finally we’ve got the shader running smoothly in the background, and it's even got some lil mouse interaction going on 😉
We're gonna keep messing around with these mini projects to see what else we can achieve in Webflow
𝗣𝗿𝗼𝗷𝗲𝗰𝘁 𝗱𝗲𝘁𝗮𝗶𝗹𝘀:
✦ 3D Graphics made in NomadSculpt
✦ Website designed in Figma
✦ Website built in Webflow with GSAP animation and ripples.js
✦ Shader created in Kodelife
✦ Loaded with GlslCanvas
Our website is up for an Awwward and we’re super pumped! 🙌
Please vote for us if you like our website as well.
Here’s how you can help:
✦ Head over to our Awwwards page: [https://lnkd.in/eHfWgP3j]
✦ Click on the “Vote” button
✦ Share with your network to spread the word!
Your vote means a lot to us and gets us one step closer to winning. Thanks a million for your support! 🙏
#Awwwards#WebDesign#VoteForUs#TeamWork#Creativity#DigitalDesign
Our collaboration with bont has been an enlightening journey.
For us, the secret to delivering high quality results in this project was to focus on {three key aspects}:
✦𝐃𝐢𝐬𝐭𝐢𝐥𝐥𝐢𝐧𝐠 𝐤𝐞𝐲 𝐢𝐧𝐬𝐢𝐠𝐡𝐭𝐬:
First, we prioritised distilling key insights from client meetings and user studies. By dedicating significant time at the beginning of the process to define pain points from both the client and user perspectives, we found common ground and developed solutions that addressed specific UX difficulties.
✦𝐒𝐢𝐦𝐩𝐥𝐢𝐟𝐲𝐢𝐧𝐠 𝐜𝐨𝐦𝐩𝐥𝐞𝐱 𝐫𝐞𝐪𝐮𝐢𝐫𝐞𝐦𝐞𝐧𝐭𝐬:
Second, we excelled in simplifying complex requirements. By breaking down intricate project requirements into manageable tasks and visualise them, we ensured clarity and feasibility throughout the development process. This approach streamlined our workflow and made it easier for all stakeholders to understand and engage with the project's objectives and progress.
✦𝐌𝐚𝐢𝐧𝐭𝐚𝐢𝐧𝐢𝐧𝐠 𝐭𝐫𝐚𝐧𝐬𝐩𝐚𝐫𝐞𝐧𝐭 𝐚𝐧𝐝 𝐟𝐫𝐞𝐪𝐮𝐞𝐧𝐭 𝐜𝐨𝐦𝐦𝐮𝐧𝐢𝐜𝐚𝐭𝐢𝐨𝐧:
Third, transparent and frequent communication with bont was a cornerstone of our successful partnership. Regular updates, open discussions, and feedback loops helped us stay aligned and adapt quickly to any changes or new insights. This level of communication fostered a collaborative environment where ideas could flourish and issues were promptly addressed, ensuring a smooth path to the MVP launch.
Hope you enjoyed reading our takeaways:)
We will update with more specific details about the design process of this project in the near future. 🆂🅾 🆂🆃🅰🆈 🆃🆄🅽🅴🅳!
Here comes our cute little teaser for bont project 📺
Next week, we will share some of the UI design and insights with you - talking about how to deliver a MVP product in a fast turnaround ✨
Congratulations to bont for going live! 🎉
Working with the incredible team as bont has been an inspiring journey, and we are grateful for the opportunity to collaborate on such an innovative product.
The constructive feedback and open communication from the bont team made our collaboration seamless. This environment of mutual respect and alignment of goals made our three and a half weeks of design process a smooth and rewarding endeavour.
What's worth mentioning is that the bont team is incredibly creative and forward-thinking. They encouraged us to push the boundaries of design and explore new possibilities. We were constantly inspired by their team's ideas as we worked together, which ultimately resulted in the product's intuitive and fresh UX and UI.
We are honoured and grateful for the #bontastic journey we have shared!
If you'd like to take a closer look at bont's MVP design, stay tuned to 1993 Design Associates, where we'll be posting a steady stream of bont MVP-related design content over the next few weeks.
#bontastic! 🎉 Less than 2 months of intense development and our MVP at bont went live last Friday!
Launching an MVP in such a short timeframe taught us a ton, and I wanted to share some key takeaways:
1. Embrace Agile Development: Quickly pushing a product to market and getting feedback from real users beats perfectionism. Iteration based on actual user needs is key.
2. Scalability Over Flashiness: While developing quickly, make trade offs for scalable solutions over immediately impressive features. Building a strong foundation for a data-intensive AI product ensures long-term success and adaptability.
3. Prioritize UX Design: Great UX can differentiate your product in a competitive landscape. Huge shoutout to 1993 Design Associates for their unparalleled design expertise, who worked with us to make bont user-friendly and intuitive.
We're excited to iterate and improve on bont. We're #buildinpublic. Stay tuned for more announcements coming soon at bont.ai, and follow us at bont