We sat down with 3 inspiring graduates from our Wix UX Students Bootcamp, class of 2024: Shani, Liel and Adi to hear about their journey, their unique student perspective on Wix’s collaborative culture and what it truly means to work in UX.

How was your experience in the UX Student Program?

Shani: When I got to Wix, I expected a typical high-tech giant where you might get lost in the crowd, but instead, I found a warm, family-like atmosphere. The people in the UX Guild truly invest in getting to know you and gently guide you into the role that suits you best.
Adi: It was a fun and intense experience. Instead of the abstract or theoretical projects I received in my studies, I got to work on real products using actual tools, soaking up insights from top UX experts. What really stood out to me was being among passionate learners and professional mentors all in one room.
Liel: I discovered the program through a friend and checked every morning until the application went live. When it did, I was ecstatic — I even shouted “Yes!” over the phone to the recruiter who called me and said I got in. It was a game changer; everything I’d learned in school was multiplied a hundredfold through real-life projects, pushing me to improve every day.

What is the “Wix way” of doing UX?

Liel: At Wix, a deep understanding of users is the foundation of everything. From your very first task — building a website during your onboarding process — you’re immersed in a clear methodology with a wide array of tools and an active community of professionals. UX isn’t a profession that’s “nice to have” here, it stands shoulder to shoulder with development.
Shani: At Wix, where UX is a core pillar, I’m passionate about deep research and genuine user insights; what we do is far more than just following a checklist and ticking off boxes.
Adi: Even though we have a solid design system, we’re encouraged to be flexible and always push for the best UX, even if that requires extra effort. This innovative approach is truly refreshing, and to me, that’s the “Wix way.”

“At Wix, a deep understanding of users is the foundation of everything. From your very first task — building a website during your onboarding process — you’re immersed in a clear methodology with a wide array of tools and an active community of professionals. UX isn’t a profession that’s ‘nice to have’ here, it stands shoulder to shoulder with development.” — Liel

What surprised you about Wix?

Liel: I was blown away by how central UX is to Wix. Unlike other companies where it might be secondary, here UX is at the core of every project.
Shani: The people make Wix special. In the bootcamp, I worked with different teams on every project and each one was fantastic. It’s both professionally and socially enriching.
Adi: UX is practically the heartbeat of Wix — it shows up in every detail, even in our physical offices. Also, getting real responsibilities early on was a huge good surprise.

What digital product do you love for their UX?

Liel: TikTok stands out for its simplicity — you just scroll and tap, and it’s all there.
Shani: I’m impressed by the 365 Sport app, which organizes vast amounts of content in an intuitive way, even for someone who isn’t a sports enthusiast like me.
Adi: Spotify’s seamless interface and integrated ecosystem — covering music, merchandise and even ticket sales — make it a standout.

Now a fun one, what physical product has the best UX?

Liel: Braun radio takes the crown for me. Its simplicity and functionality showcase Dieter Rams’ legendary design principles, which have even influenced Apple.
Shani: I’d choose a sofa. It’s versatile — ideal for working, relaxing or even sleeping. In my eyes, it’s the heart of a home.
Adi: A push door wins here. With its one-directional design, there’s no confusion — just a simple push. Sometimes, the best UX is the one you hardly notice.

“Many assume UX is only about design, but it’s really about making products accessible, usable and understanding user behavior on a deeper level.” — Shani

What was a project you loved being a part of?

Liel: I joined the Customer Care team and worked on User Voice, an innovative AI tool that captures genuine user feedback. It was my first experience building something entirely new, and that challenge was incredibly rewarding.

What makes Wix the right place for your UX career?

Liel: Starting your career at a large, resource-rich company like Wix is an opportunity that is unmatched. The growth and learning opportunities here are on a whole nother level compared to smaller startups.
Shani: The collaborative spirit and continuous learning make Wix an environment that triggers excellence.
Adi: Wix plays a major role in shaping the design world. Being part of a team that actively influences industry trends is both inspiring and fulfilling.

Do you have any tips for getting accepted to the student program?

Shani: Focus on preparing a detailed case study. Rather than just showing the final product, highlight your thought process and design journey — that makes all the difference.
Adi: Keep nurturing your curiosity. Always ask why a design works the way it does, this mindset is exactly what Wix is looking for.

What do people often misunderstand about UX?

Shani: Many assume UX is only about design, but it’s really about making products accessible, usable and understanding user behavior on a deeper level.
Adi: We’re a blend of creative designers and behavioral psychologists. Great UX not only looks good, but also enhances functionality and user satisfaction.

“We’re a blend of creative designers and behavioral psychologists. Great UX not only looks good, but also enhances functionality and user satisfaction.” — Adi

For more information and application to the Wix UX Student program visit our website.

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

Our UX Student Program Graduates Share Their Journey was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.

Revisiting and mastering the basics of UX design can lead to astonishing results.

What if the key to improvement isn’t about what’s new, but about mastering what’s timeless?

It’s the case in product design, where significant strides can be achieved by returning to good old practices such as conversational copy and progressive disclosure. At Wix, we experienced this firsthand when we empowered our team to apply core UX strategies to one of our most complex challenges: the setup flow for Wix Multilingual.

The result? A dramatically improved user experience that boosted key performance metrics across the board.

The case study: Revamping Wix Multilingual setup flow

Wix Multilingual enables users to create multilingual sites seamlessly.
However, we faced a significant pain point: users frequently selected the wrong main language — the language to translate from — during setup. Eager to begin translating, many mistakenly chose the language they wanted to translate into, leading to confusion, inadequate product usage, and skyrocketing customer care costs.

While we couldn’t change the sequence of language selection due to backend limitations, there was probably something we could do better in how we explained what action to take. We focused on core UX strategies to address the problem.

Fundamental 1 — Progressive disclosure

The initial design featured a single modal crowded with two dropdowns and important information tucked away in tooltips. This cluttered approach contributed to user errors and misunderstandings.

Our solution: We restructured the setup into six clear, manageable steps:

1. Welcome page: Highlighting the benefits of Wix Multilingual.
2. Automatic detection: The system detects the site’s main language.
3. Confirmation: Users confirm the detected main language.
4. Alternative selection: Option to select a different main language if necessary.
5. Flag selection: Choosing the appropriate flag for the language.
6. Final confirmation: Review and confirm the selections.

Adding more steps is controversial. It’s often perceived as slowing users down and potentially causing drop-offs. If users struggle with one screen, how would six be any better?

To convince our stakeholders, we used these arguments we invite you to try with your own work buddies:

• Cognitive load is reduced: Progressive disclosure allows users to focus on one task at a time, often proving more efficient than processing multiple actions simultaneously.
• It “humanizes” the interaction: Sequential steps emulate a friendly, didactic conversation, making the experience more engaging.
• You can’t always measure a flow by the number of clicks. This must be weighed against other factors, such as frequency. While repetitive flows (writing messages, updating statuses, etc.) need as less friction as possible, it makes sense for exceptional ones (setup, payment, etc.) to require more clicks.
• Users are more resilient than we often give them credit for. They understand that important flows deserve some investment.
• It has practical benefits for developers too. In particular, it’ll be way easier to add or remove steps at your convenience later on — a less straightforward task with a single modal.

You can’t always measure a flow by the number of clicks. This must be weighed against other factors, such as frequency.

Fundamental 2 — Conversational language

Presumably, UX writing is by essence the craft of conversational language. Except that in practice, copy easily becomes verbose and less user-centric, especially when dealing with intricate flows.

At Wix, we emphasize that content should be written as if you’re having a phone conversation with a friend who can’t see what you’re describing. This approach forces you to focus on using simple terms, perhaps a metaphor or two, and to work hard at breaking complex notions into digestible chunks.

Making the content really flow like a conversation requires using some key tools:

• Questions: These are great because they acknowledge the user’s role in the process, and force them to stop and consider what’s needed from them. Whenever you can, replace commands with inquiries to engage users — for instance, “What’s your site’s main language?” instead of “Choose your site’s main language”.
• Personal pronouns: If your whole interface is built around conversations, there’s no way around pronouns — at least in languages like English. We consistently used ‘you’ in our setup and introduced ‘I’ in user responses. For example:
• Interface: “Is English your site’s main language?”
• User: “No, I want to change it.”

Pay attention to the use of ‘I’ here. Adding this pronoun is a small yet powerful tweak, allowing users to assert their individuality in an otherwise routine flow.

• Affirmative language: Phrases like “Let’s confirm your main language” promote a collaborative atmosphere. This approach balances guidance with user empowerment.
• Prepopulated answers: Favor ‘yes’ and ‘no’ options. These basic conversational elements allow users to make clear, confident choices.

Content should be written as if you’re having a phone conversation with a friend who can’t see what you’re describing.

Fundamental 3 — Frictionless input

A cleaner interface helps users focus on their input. We made several UX adjustments:

• Searchable dropdowns: Replacing static dropdowns with an autocomplete search bar streamlined the selection process.
• Eliminating tooltips: We decided to work 100% tooltip-less. These hidden elements greatly disrupt the conversation — pretty much like the continuous flow of Whatsapp notifications your other half receives while you try to have this important chat with them…
• Prominent information display: Critical information (“You can’t change your main language afterward”) is now displayed upfront to reduce errors.

Fundamental 4 — Demonstrating effort

Users value processes that involve hard work and show it. This cognitive bias is called the “labor illusion”.

“We have a tendency to perceive products and services more favorably when we’re aware of the effort that was put in to create them”, Jo Ash Sakula explains in his article “Neurodesign: 7 tips for deeper emotional engagement”. It impacts teachers grading students, bosses rewarding employees and, of course, users responding to interfaces.

We leveraged this by adding, at the beginning of the setup, a step that shows the system automatically detecting the site’s main language. Though the process is actually instant, a loader and animation create the perception of effort. For users, it builds trust and reduces anxiety.

Fundamental 5 — Keeping users aware of progress

Even when users don’t need to be involved in background processes, they want to know where they stand. Implement steppers or similar elements to guide users, adapting this approach beyond just setup flows.

Here are some basic things to consider when creating your own stepper:

• Number and name steps for clarity. This helps manage user expectations and prevent frustration.
• Allow back-and-forth navigation between steps. Feeling trapped will only drive users away.
• Use bold headers for each step. A clear and visible hierarchy is key to intuitive navigation.
• Acknowledge progress with explicit terminology, such as “Great!”, “Now…”, etc.

Fundamental 6 — Ensuring users control and approval

In our setup, we used a few mechanisms to ensure users can preview and approve:

• Real-time preview snippet. Preview snippets are increasingly common, notably in the AI industry — think of Claude’s Artifacts, which can display pretty much everything from lines of code to full designs. Such previews are important, and not only because they look cool. They actually fulfill a psychological role by putting the user’s decisions right in front of their eyes, forcing them to pay more attention. In our setup flow, we provided users with a visual, real-time representation of the language and flag they picked. We immediately saw an impact in the number of users choosing the wrong main language, which was the original goal of the whole makeover.
• End-of-flow summary, allowing users to review their selections before proceeding.
• User-centric language. We emphasize user responsibility in their choices: “You’ve chosen English as your main language”.

These mechanisms enhance trust, provide immediate feedback, and add an AI-like feel without having to develop complex solutions.

Fundamental 7 — Trusting your UX team from the onset

A critical element of our success was trusting our UX designers and writers to lead the solution from the start. A natural tendency in many product teams is to come up with a pre-formed solution to the designer, asking them to build a beautiful Figma around it, and then the writer to fill it with words.

In that case, UX professionals were involved from the beginning, not just in execution but in strategy development. By questioning existing beliefs — like the idea that more steps would deter users — and guiding them by data and testing, we found better solutions.

Remarkable results

By simply focusing on fundamental UX principles, we achieved:

• -47% decrease in user complaints: Users faced fewer issues, reducing the need for support.
• -56% reduction in churn rate: More users continued to engage with the product after setup.
• +22% increase in primary conversion KPI: A higher percentage of users completed the desired actions.
• +19% growth in visitor traffic to secondary languages: Enhanced multilingual sites attracted more global visitors.

Empowering UX professionals

In the quest for innovation or product improvement, it’s tempting to chase the latest trends and technologies. However, as this case study demonstrates, profound improvements can be achieved by mastering and creatively applying the basics of UX design.

This case study underscores a pivotal lesson: sometimes, the most impactful improvements arise not from novel technologies, but from re-engaging with the foundational principles of our craft. How might returning to the basics transform your next project?

Jonathan Sitbon, UX writer, and Roei Ben Zvi, UX designer

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

Back to basics: How fundamental UX principles lead to big results was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.

Unlock your potential with purposeful development, strategic planning, and a mindset built for success

Our professional growth often happens organically as we gain experience. But what if we approached it more intentionally, actively improving areas we want to elevate by focusing on them and working with an organized, structured plan?

This article explores the concept of growth, highlighting how investing in your development can boost job satisfaction and contribute to your overall career success. I’ll also share some practical strategies for effectively planning and implementing growth.

Understanding growth

Growth is a mindset that involves a commitment to the continuous process of enhancing skills, knowledge, and expertise.

In the fast-paced field of product design, it’s essential to stay updated with new technologies and methodologies, refine your craft, build resilience, enhance problem-solving skills, foster creativity, and drive career advancement.

There are several types of growth paths:

Professional: Improving craft and technical skills in product design (e.g., usability testing, user interviews, UX writing, etc.)

Personal: Improving soft and personal skills (e.g., communication, problem-solving, resilience, etc.)

Leadership: Transitioning into a leadership position.

Crafting a growth plan

When building a plan, it’s crucial to recognize that you play an active role, while your manager can offer guidance, assist with selecting the right path, and help track your progress.
Start by assessing your current skills, strengths, and weaknesses to identify areas you want to improve.

Tips:

⚬ Feedback is a gift; embrace it and learn how to receive it effectively.

⚬ Embrace discomfort — growth often happens outside your comfort zone.

⚬ Resilience and persistence are key to overcoming setbacks.

⚬ Be patient; meaningful growth takes time.

Step 1: Setting your growth goal

A well-defined goal transforms vague aspirations into concrete, achievable milestones, in alignment with your career plans, and identifies specific skill development.

Assess how far you are from your goal and identify potential obstacles you may encounter along the way (consider blockers like time, knowledge, people, logistics, etc.).

Finally, determine the support you’ll need from your manager and peers throughout this journey.

Tips:

⚬ Build a short term plan with a relatively modest goal

⚬ Try to align personal growth with company objectives for mutual benefit.

Step 2: Creating an action plan

Growth is a continuous journey, not a one-time event. While learning and growth often occur organically, whether through our daily tasks or by trying new things, a structured approach can accelerate our progress.

An action plan sets clear timelines, and provides a framework for tracking progress. By focusing on specific tasks and measuring outcomes, we can optimize our learning and ensure consistent development.

The 70/20/10 framework is a well-regarded model for learning and development, particularly in the context of professional and leadership growth. It emphasizes focusing on concrete actions and suggests that the majority of effective progress comes from day-to-day tasks that lead to achievement. Combined with mentorship and formal education, this structured approach transforms aspirations into achievable outcomes.

With a goal in mind, create a plan using these key components of the model:

• On-the-job experiences: 70% of Learning comes from experience through challenging assignments and special projects.
• Learning through others: 20% comes from mentorship, industry professionals and feedback.
• Formal education: 10% of learning comes from workshops, articles and e-learning materials (e.g. podcasts, video lectures).

Step 3: Tracking your progress & Way forward

Regularly seek and utilize feedback to ensure you’re on the right track. Reflecting on this input helps you make necessary adjustments and stay aligned with your goals.

Clearly outline both your immediate and future steps to continue building on your progress.

Tip:

⚬ The plan is dynamic — Regularly reflect on your progress and adjust your strategies.

Step 4: Reflection and achievements

This last step is all about reflection, where you review the activities you’ve completed and assess whether you’ve achieved your goal. It’s your opportunity to acknowledge your progress, learn from the process, and, most importantly, celebrate your achievements.

Tips:

⚬ Teach others what you learn — it reinforces your own understanding.

⚬ When a plan is achieved, celebrate!

Growth isn’t just about reaching a destination — it’s about the progress you make along the way. Your growth journey is yours to shape, and with the right mindset and approach, the possibilities are endless!

Check out my article: ”The secret ingredient for team success — Personal connections”

Edited by Aoife Geary

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

Master your career journey: The power of intentional growth was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.

Elevating Product Quality:
The UX Blitz Approach

Over the past year, I’ve noticed how “quality” became a critical benchmark for companies aiming to stand out in a competitive market. While it’s true that quality has always been a cornerstone of business strategy, the big change now is that it’s no longer just an abstract concept. Quality has become a standard that every team member understands and actively pursues, making it a shared commitment throughout the organization.

In a fast-paced industry, staying ahead of the competition is crucial, and building new features is always exciting. We look for the next big thing to make an impact, create something life-changing, and showcase our skills. But let’s talk about quality for a moment. We aim high and hope our products aren’t just good, but great. Yet, once they’re out there, we often hit cruise control and shift our focus to the next shiny object. It may seem straightforward to see if a new product made waves — did it impact our bottom line? Did people use it as expected?

It’s a shift in mindset, processes, and metrics to ensure quality is not just an afterthought but a foundational element of product strategy.

Prioritizing quality over creating new features is a nuanced challenge that touches on strategic, operational, and cultural dimensions of product development. It requires a balanced approach, acknowledging the importance of innovation while recognizing that the sustainability and success of a product are deeply rooted in its quality. It’s a shift in mindset, processes, and metrics to ensure quality is not just an afterthought but a foundational element of product strategy.

“When we build a feature and it works, we move on to the next. But we always keep an eye on it.”
Avishai Abrahami, Wix CEO and Co-founder

At Wix, we decided to make quality our pride and glory, with various teams tackling this challenge, from performance, SEO, Production, A11y, SLA, to bug fixing. Our UX Guild took this effort to the next level, focusing on experience, which was even more challenging as it required educating and convincing different disciplines to invest in something they couldn’t immediately see or measure, especially when the payoff is down the road.

Defining Quality: Key Questions and Considerations

• Is it just about making things run smoothly and squashing bugs?
• Do we categorize broken workflows or missing functionalities as elements of “quality”?
• Should we consider issues resulting in a frustrating user experience as part of our quality standards?
• Who determines what meets our quality standards?
• What if we can’t fix things due to dependencies on other teams?
• Is it feasible to stop ongoing tasks to address quality issues immediately?
• Could we implement a rating scale from 1 to 10 to measure our product’s overall quality?

So, what does quality mean for us?

Our definition of quality means ensuring that existing features work flawlessly, enhancing the overall user experience. It involves more than just functionality; it takes a holistic approach to designing products that efficiently, clearly, and delightfully meet users’ needs.

What happens when we make quality our priority?

1. Reduced support tickets
2. Enhanced operational efficiency, long-term viability, cost savings, and scalability
3. Satisfied users are more likely to stay engaged and recommend the product to others

Wix UX Quality Blitz: A Tangible Expression of Wix Commitment to Quality

To ensure quality wasn’t overshadowed by new features, we needed some kind of a SLA for experience issues. Before implementing this, we had to align everyone on what constitutes UX quality and why it is crucial. That’s how we came up with the ‘Wix UX Quality Blitz’ — a 1 to 3-day marathon conducted once per Q, where the entire team, led by UX, meets to fix as many flaws and overlooked issues in our products as possible. This initiative highlights Wix’s commitment to delivering top-notch products to its users by focusing on four main areas:

1. Experience issues: Clarify processes, simplify navigation, ֿand streamline complex workflows.
2. UI and visual assets: Enhance clarity, professionalism, and a modern feel.
3. Content improvements: Ensure the text is clear and helpful.
4. Accessibility: Make the product accessible to all users.

To illustrate the effect of a ‘UX quality blitz’, here’s a couple of examples from our products:

Preparing for a Quality Blitz:

Identify quality issues:
Conduct a comprehensive product audit to identify areas needing enhancement. Use tools like Fullstory for user interaction analysis, conduct usability testing, hold user interviews, and gather feedback from support teams to compile a list of potential improvements.

Create a quality backlog:
Encourage contributions from all team members, including UX designers, product managers, writers, developers, and QA analysts, to promote a collaborative approach to quality improvement.

1. Prioritize issues:
   Evaluate each issue based on its impact on the user experience (severity) and the effort required for resolution (development effort). This helps prioritize tasks that will have the most significant effect on quality for the least expenditure of resources.
2. Organize the team:
   Assemble a multidisciplinary team capable of addressing the identified issues. This team should include roles such as UX designers, developers, product managers, business analysts, and QA specialists.
3. Plan the event:
   Set a date and venue: Choose an off-site location if possible to minimize distractions and foster a focused work environment. At Wix, we have a tradition of creating a theme for the event to make the experience even more enjoyable and memorable for everyone involved.

• Prepare necessary resources:
  Ensure all necessary materials, such as Figma files, BI events, and content updates, are prepared in advance.
• Define the agenda:
  Clearly outline the objectives and schedule for the blitz to keep everyone on track.

Showtime! Conducting a Blitz:

1. Kickoff:
   Start with an introduction that motivates and aligns all participants on the day’s goals. Providing snacks or small incentives can create a positive and energetic atmosphere.
2. Work session:
   Dive into the backlog, with each team member tackling tasks according to predefined priorities. Maintain an open environment where participants can ask questions and seek help as needed.
3. Midday check-in:
   Regroup to assess progress and realign if necessary. This helps address any hurdles and ensures the team is on pace to achieve the blitz’s goals.
4. Wrap-up and demo:
   At the end of the session, review all completed tasks and document any unresolved issues that need more attention. Celebrate the day’s achievements to boost morale and acknowledge everyone’s hard work.

Post-Blitz Actions:

1. Celebrate and share successes: Host a meeting to celebrate the team’s accomplishments. Sharing success stories and individual contributions can motivate the team and reinforce the importance of quality.
2. Monitor and measure impact: Track the impact of the improvements on user experience and operational efficiency. Use this data to refine future quality efforts.
3. Update the quality backlog: Add new tasks discovered during the blitz to the backlog and plan the next steps in the quality journey.
4. Schedule the next blitz: Regularly scheduled quality blitzes can ensure continuous improvement and help embed a culture of quality within the organization.

Tips & Notes:

Quality over quantity! If a task gets too complicated for a blitz day, move on to the next or prioritize it as a roadmap task.

What Did We Achieve from Our Quality Blitz?

“Prior to the Quality Blitz, quality issues were typically addressed on a ‘best effort’ basis, often resulting in them not being resolved within the desired timeframe. The Quality Blitz transformed our approach, pushing us to actively tackle and resolve many more quality issues. This shift established a higher benchmark for product delivery, ensuring a high quality user experience.”

Yael Wetterstein, UX designer at wix identity team

Incorporating quality into the product process is not just about fixing bugs or refining features; it’s about adopting a quality-first mindset that permeates every aspect of the design and development process. By following the strategies outlined in the Wix UX Quality Blitz, we ensure that our products not only meet but exceed user expectations. Quality is not just a goal — it’s the foundation upon which exceptional product teams and user experiences are built.

Edited by Daniel Raz

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

Elevating Product Quality:  The UX Blitz Approach was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.

Being a great leader means building strong team bonds to create a supportive and motivated environment that helps to impact business objectives

I’ve been in product design management roles for many years now. In my current role, I manage a product design team where I oversee the UX for one of the company’s most strategic and high-focus areas. We are in charge of several purchased services we suggest to our users to run their businesses.

My team is responsible for creating the optimal UX for these sensitive products, all of which greatly impact the company’s business. I implement different steps to achieve this but a primary objective is to ensure that the team is always aligned with the company’s objectives.

About our team routines

Additionally, I run several key routines that ensure effective communication and professional improvement for all of us as a team, and each individual. These include:

• Weekly meetings to catch up, share knowledge, review UX solutions for quality, and stay motivated. This is also our time to celebrate birthdays or special achievements.
• Design sprints to quickly develop and test new solutions for specific problems

• UX guild activities to share knowledge, participate in enrichment workshops, discuss methodology, and hone our skills (In Wix, the guild represents our professional home).
• One-on-one personalized feedback sessions between each designer and myself to discuss individual concerns and growth opportunities. Plus, formal yearly feedback and periodic growth discussions.
• Fun activities to strengthen personal relationships and improve team cohesion.

As leaders, it’s easy to get caught up in strategy, processes, and resources. And while those are important, something that often gets overlooked is the strength of personal connections between team members.

Strong connections in teams make collaboration and open communication easier, they build trust, boost morale, encourage creativity and, ultimately, increase productivity.

A big goal of mine as a manager is to foster close relationships in my team. To encourage this, I organize routines for us throughout the year and keep a Pinterest board with our photos, which we then turn into short movies to play at our special events, which I find is an emotionally resonant way to highlight our journey together.

Some of the regular activities we’ve done so far, are:

• Quarterly home dinners: We have a tradition of hosting dinners at our homes every quarter, where everyone brings a dish. I try to connect these events to holidays or any changes in the team. It’s a lovely way to bond outside the office.
• Beach picnics: Since our office is next to the beach, we organize after-work picnics there. It’s a great way to unwind and share some laughs.

• Weekly team lunches: Every week, we schedule a team lunch to catch up and enjoy each other’s company.
• Team Offsites: Another big part of my approach is organizing team offsites. We aim for one offsite per year, tailored to the specific needs of the team at that time.

So far, I’ve led 3 types of offsite:

• Strategy: Focused on defining the group’s strategy, goals, position within the company, and professional standards.
• Growth: This was geared towards personal growth and the individual development of the team members.
• Team building: The most recent offsite focused on team building and fostering connections among individuals.

A side note

I want to take a moment to share the reasons that led me to dedicate a day solely to team building.

Until a few months ago, my design team was very stable, and the personal connections within it were strong. Our daily routine was filled with a sense of unique pride, companionship, and mutual support.

Everyone felt comfortable sharing and discussing matters unrelated to work. These feelings greatly benefited our professional output. They pushed us to constantly collaborate, confidently share solutions and ideas, give and receive feedback, support each other, come to the office smiling, and ultimately be more productive.

This strong foundation also made it easy to onboard new designers or replace team members when needed.

A few months ago the team began working from home. Our group meetings turned into video calls and our office chats turned into Slack messages. What was once a fun office atmosphere with lunches together and constant human interactions became a much more isolated experience for many of us.

Little by little we started to return to the office, but it felt like our regular dynamic had changed a bit and we hadn’t had a chance to really get to know the newcomers.

I realized it was time to take some time to pause and do some team building, connect with new team members and get us all together again.

No work stuff, no talks about products or users — just us, getting to know each other better. Some time to share about ourselves, learn more about each other, and really connect.

Designing the team building offsite

Ideas that helped me shape the day

While planning this day, I first tried to identify the common ground we all share as a team. We’re all creative individuals who enjoy hands-on activities, have rich inner worlds, and emotional depth.

I realized that I wanted each of us to go through a personal reflective process, where we explore who we are, what makes us unique, what we value in our lives, and what we’re willing to let go of or willing to offer others. I wanted each of us to share these more personal aspects of ourselves to help us connect more as a team.

With this in mind, I began searching for creative short workshops to kick off the day. I listened to podcasts and collected ideas on how to bring together creative minds for mutual recognition and empowerment through collaboration.

I also decided I wanted each participant to end the day with something tangible — a keepsake that would serve as a constant reminder of the experience.

Choosing the location was easy. Our campus has a variety of rooms for every purpose. I booked two spaces: a room designed for creative workshops and a special, intimate lounge for the rest of the day’s activities.

This approach ensured that we could reconnect deeply and carry the day’s lessons forward into our daily work lives.

Get the day started by embracing creativity

After breakfast, and without any formal introduction, we gathered in the “Makers” space which was specifically designed for craft creation.

With no special instructions, we all sat around a table together and did a watercolor painting. Each person painted whatever came to their mind, without aiming for any particular level or standard.

We were impressed by the variety of results. It turned out each team member could produce a creative and interesting painting on their first attempt, despite everyone initially worrying that they “can’t draw.”

After a short break, we moved to a more intimate space where we continued the day’s activities. Entering the room, each team member found a folder with their name on it. Inside were premade pages organized in order. At the top of each page was an idea I planned to focus on throughout the day.

I believe that when team members enter a room with something prepared just for them, it creates a sense of excitement, appreciation, and engagement with the day’s activities. This little touch can set the tone for a meaningful and productive offsite.

A year retrospective in 3 dimensions

I kicked off the more formal part of the day with a review of our goals as the Premium UX team, the reasons for our gathering, and our objectives for the day.

The next part was a review of the last year in 3 dimensions:

• Our past: What we had experienced over the past year: changes in our human landscape, our unique initiatives and achievements, and all the fun we’d had together.
• Our present: Our current environment, the challenges within the company, changes in our work framework, and why we, as product designers, must adapt and align with these shifts.
• Our future: The need to become a high-performing and professional team to meet the demands of a constantly evolving company.

This day’s objectives

This session naturally led to the inevitable question: What can make us such a high-performing team?

We brainstormed and listed numerous values on the board that could help us achieve this goal: flexibility, assertiveness, presence, professionalism, cooperation, sharing knowledge, communication, humanity, awareness of changes, opportunities, sharpness, respect for one another, patience, trust, and more.

However, we also realized that all of these values can only thrive with one essential foundation: we have to be connected.

This was a great way to establish the day’s goal: “Make space to get to know one another on a deeper level. Create meaningful connections and a sense of belonging between ourselves. Align, but also have some fun along the way”.

Team empowerment

As I mentioned, we’re all very creative so I found another way to use this shared ability in a collaborative portrait drawing session whose purpose was mutual observation and attention to one another.

Here’s how it worked: Sitting in a circle, each team member opened a folder to find two pieces of paper, both with their name written on it, and an envelope attached to one of the pages.

We passed the two pages to the person on our left and began a collaborative creation of our portraits. Each part of the face was drawn by a different team member in sequence: face contour, hair, eyes, eyebrows, nose, mouth, ears, and neck.

As we drew each feature, we also wrote personal notes of empowerment for the person we were drawing. These notes were then placed in their private envelopes. The activity made us pay attention to each other and feel a profound sense of appreciation for one another, bringing out not only our artistic abilities but also our mutual respect and support.

At the end of the round, the completed drawing consisted of a collective portrait of all of us, which prompted us to look at and explore each other’s faces. The envelopes were filled with empowering and uplifting words.

We put all the portraits next to each other, amazed and moved by how they were drawn — with precision and real attention. Then, we took the time to share some of the notes each person had received from their teammates. This was a really beautiful and impactful moment for all of us.

Our personal space: Part 1

The goal of this session was also to deepen familiarity with each other. To run this activity, I created a list of about 40 words, including terms like “attention,” “border,” “path,” “field,” “whisper,” “sound,” and more.

One of our amazing designers created and printed these words on cards, then laid them out on the table. Each participant was asked to choose one word that resonated with them. Taking turns, everyone explained why they had chosen their specific word and how it connected to their values, beliefs, or memories.

This exercise brought us closer by allowing each of us to share a piece of our inner world. It was a beautiful way to understand what matters to each team member on a deeper level, further strengthening our connections.

Each person stuck their chosen word to a paper they found in their folder.

Our personal space: Part 2

After a break for lunch, we continued with more exercises to get to know each other better.

In order, we pulled out pages from the folder, each containing an idea to reflect on:

• My secret sauce: The unique ingredient I add to every “dish”, making it recognizable as mine.
• I’m willing to give this for free: A skill or ability I’m proud and happy to contribute to others, whether it’s being a shoulder to cry on or offering high-level professional mentorship.
• The languages I speak: My communication style.
• What heals me: What cures me when I’m feeling down or bad.
• My “Let it be”: One thing or more that I’m wishing for myself — “I want to be better at…” “In a year from now I will be/have…”
• My “Let it go”: One or more things I’m willing to let go of, whether it’s a behavior, mindset, feeling, or bad habit
• My gratitude note: One or more things that I’m grateful for.

These exercises revealed interesting aspects of each team member. We showed a lot of different sides of ourselves, connected, and had a lot of fun together.

Before ending the day, we watched a fun movie capturing some of our memorable moments together. And after a round of feedback, we took a group photo.

Each team member went home with a folder that held a variety of memories and ideas from that day.

Summary

When planning this day, I wasn’t sure if the team would fully engage in every activity, as some might feel uncomfortable opening up. Regardless, I decided to take the risk, accepting that some might actively share and participate while others would maybe prefer to just listen.

Surprisingly, we found that sharing is very contagious (in a good way). All it takes is one person to start sharing for others to quickly open up as well.

Our dedicated team-building day was a profound reminder of the importance of personal connections. Through a series of carefully planned activities, we were able to step away from our work environment and focus on getting to know each other on a deeper level.

By engaging in creative workshops, personal reflection exercises, and collaborative sessions, we showcased our talents and unique perspectives and strengthened our mutual understanding and trust. These activities highlighted the value of each team member, contributing to a stronger sense of belonging and camaraderie.

Some words from the team about the day:

“Having the opportunity to talk and open up was fun and interesting. We had a chance to spend time together and get to know each other better.”

“Starting the day with the watercolor activity was relaxing and enjoyable.”

“As we entered the room, we found folders with our names prepared ahead of time. It felt good, and I was glad to take it home as a reminder”

Team building, of course, is more than a single-day’s effort. It’s an ongoing process that requires consistent dedication and thoughtful leadership.

The strength of personal connections within a team really is a huge driver of performance and success. So, as leaders, we’re responsible for continually helping these connections to flourish through deliberate and ongoing efforts, creating an environment where everyone feels valued, supported, and motivated to contribute their best.

Edited by Daniel Burton

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

The Secret Ingredient for Team Success: Personal Connections was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.

Recently, I’ve had the opportunity to hire UX designers for my team, and I also participated in Wix’s excellent mentoring program. In short, I’ve reviewed a lot of portfolios. It wasn’t surprising that most portfolios looked quite similar, but what caught my attention were the recurring mistakes. After all, our portfolio is supposed to speak for us. So, I asked myself: if a portfolio could talk, what would I want it to tell me?

First Things First — Define the Goal and the User

Hi! Nice to meet you, I’m Tamar’s portfolio. I know your time is very limited; you’ve probably seen dozens of portfolios today, all while juggling your regular tasks at work. I’m here to spark your interest in Tamar’s work enough to get her invited for a first interview.

The Key Point

We tend to forget that, in essence, our portfolio is another product we’re working on. Just like any other product, it’s crucial to define its goal and target audience right from the start. Here are the definitions I came up with:

• Goal: Create a strong enough first impression to get an interview invitation.
• User: A product designer or team leader, swamped with tasks and short on time.

Keep it Short, Keep it Simple

Look, I don’t expect her to get the job just because of me. The detailed explanations of each decision and project are something she can cover in the first interview. Even I have limits. Anyway, I’ll keep it short and easy for you. Let me do the work for you. Ready to start?

The Key Point

Our users have limited time and a clear goal. Remember, you’ll have time in the first interview to delve into the details and explain all your choices. Focus on summarizing the projects in your portfolio to highlight the most important parts, the key takeaways, and the specific processes you’ve mastered.

For Example

Notice the difference between the first portfolio of Erik Kennedy, a freelance product designer and the owner of “LearnUI design”, and his current one. It’s not just about the significant reduction in text but also the improved scanning through images, headlines, labels, and lists. The screenshot is taken from Erik’s helpful blog series about “Creating a Standout Design Portfolio”.

Think About Who You Are and How You Want to Be Perceived

So Tamar is an experienced product designer. Here are 2–3 sentences she wrote about herself. It might look simple, but it took her a long time to define what interests her, what drives her, what she loves to do, and perhaps to add a few personal details to help you get to know her, in so few words. She wanted the text to be more accurate and sharp than typical self-descriptions to capture attention, knowing this would be the first impression readers would have of her. Writing clearly and briefly is an art. As Mark Twain said, ‘I didn’t have time to write a short letter, so I wrote a long one instead.

The Key Point

Almost every portfolio starts with 2–3 sentences. Think about what sets you apart from others. Remember, the person visiting your site doesn’t know you, so your choices usually convey something about you. For example, writing “Hey! So glad you’re here, I’m Tamar, a product designer, etc.” sends a different message than “Hello, I’m Tamar, a product designer, etc.” There’s no right or wrong here, but ask yourself what you want to convey and how you want to be perceived.

For Example

The first thing that caught my eye in Bettina Bergendahl’s portfolio was her choice to write an introductory paragraph in a style different from most portfolios. In just 20 words, I felt like I got to know her a bit more, both professionally and personally. Non-generic means that there’s no chance another designer would have the same description.

Web designer Anthony Grant chooses to stand out through his immediate and unique approach.

Product designer Yash Shenai shows how to make an intro more Oh Yeah!

Choose Diverse Projects

Okay, here are 3 projects Tamar is proud of. She made an effort to ensure each project is from a different field to showcase a broad spectrum of skills and appeal to various types of recruiters and companies.

The Key Point

Different recruiters work on different products and often look for versatility. Try to cater to a range of fields, while demonstrating the ability to handle more than one type of product (mobile, desktop, complex systems, etc.).

For Example

Julia Sesko’s portfolio homepage showcases a variety of specializations — design systems, complex systems, mobile applications, and more.

Think About What Helps the User Make a Decision

In each project, you can immediately see a short sentence about the project to understand if you’re interested in learning more, along with a screenshot from the project. It would be strange if you only saw the project name, which you might not recognize — what value would that provide?

Tamar sorted the projects in the order she believes makes the most sense. The first project is likely the most in-depth and interesting, but the second and third are also quite intriguing, just so you know.

Did you see something you’re interested in exploring, or should we go with Tamar’s order and start with the first project? I told you, I don’t want you to put in too much effort.

The Key Point

Give your user the relevant information to help them decide which project to delve into. For example, writing “Maple: How fun it is to walk with friends!” next to a picture of friends walking in nature doesn’t really say what the project is about. But if it said, “Maple: A mobile app for creating and sharing walking trails,” along with a screenshot of the app, it would have been easier to understand what to expect.

For Example

On Liat Stern’s homepage, I easily understand what I will see when I enter any project — a large screenshot from the project, what was her part in it, on which platform, and who was it intended for.

Remember That You Are The Product

Great, welcome to the first project. I’m glad I caught your interest enough for you to click. Just like in a cookbook, you’ll see an enticing screenshot of the final result right at the beginning of the page, followed by a short paragraph providing background on the project — what it was for, some context about the company or the framework.

The Key Point

The product isn’t the project you worked on; you are the product you need to market.

For Example

The final product offers a glimpse into your capabilities. On the left: a recipe from the Israeli blog ‘So, What Do You Do All Day?’ On the right: a project from Erik Kennedy’s portfolio. In both cases, I’ll keep scrolling if the final result looks interesting (or tasty) enough.

Experiment with Hierarchy and Design

Look, Tamar and I treat each project like a story we want to guide you through, so it’s important for us to set the stage with some context. Like any story, ours consists of ‘Reality,’ ‘Conflict,’ and ‘Solution.’ First, we’ll explain the current state of the problem Tamar tried to solve. Then, we’ll get to a very significant part: the ‘Conflict.’ The problem. The reason we’re here. That’s why you see it in a relatively large, bold font. I didn’t want you to miss it because everything stems from there.

The Key Point

A project page is not an academic research article for a prestigious design journal; it’s a web page, so take advantage of that and play around to highlight the hierarchy and the important elements. Maybe make the problem statement in an exaggeratedly large font? Perhaps the headers font can be small but bold? Maybe add an underline in a standout color? This is your playground. Experiment by pushing it to one extreme and then the other until you find the balance that works for you. Equally important, show it to others to make sure it works as you intended.

For Example

Eugene Lazebny effectively uses a hierarchy of titles, background colors, font sizes, colors, and weights to convey the story’s main points.

Be a Person, Not a Checklist

Now that we’re on the same page, let me show you the process Tamar went through in the ‘Solution’ phase. Honestly, I don’t want to give you a grocery list of ‘Here are some screenshots of competitors, here’s a giant Shutterstock image of a generic person with a generic persona, here’s a wireframe because it’s needed, and here are some designed screens with lots of text explaining each one.’ That’s not my style. I told you. I want to guide you through this story and showcase the main character — Tamar. So, I’ll start by going through some competitors, but more importantly, I’ll tell you what Tamar learned from them. Then I’ll tell you that Tamar interviewed seven users, focusing on her key insights from those conversations. I told Tamar that talking to users just to tick a box isn’t enough for me.

The Key Point

It’s not hard to find someone who can gather competitor screenshots and talk to users. The actual challenge is knowing how to draw relevant conclusions from the research and showing how the research influenced your design choices. It’s all about your reasoning and your ability to draw conclusions.

For Example

Bettina Bergendahl first summarizes the main conclusions she drew from her research, and only then walks us through her reasoning for each conclusion.

Highlight the Important Points

I might summarize a few more parts of the research for you and highlight the interesting sections in yellow to save you some effort.

The Key Point

Improve each paragraph by focusing on the most important ideas and removing unnecessary details. Find the key point of the paragraph — either a sentence or 2–3 words that capture the main idea — and make them stand out.

For Example

Studio Z1 uses “doodles” to highlight what’s important.

Designer Estella uses a green text motif to highlight what she considers crucial.

Don’t Make Me Think

I spared you from those giant icons and UI doodles that don’t serve a purpose because I wanted to help you focus on the main flow Tamar created. Here’s the design as is, so you can appreciate both the UX and UI. I didn’t want you to go over random screens or typical flows like login and signup. I wanted to bring your attention to screens that highlight her skills in designing meaningful and interesting user experiences.. I marked anything noteworthy and had Tamar write a few words about it.

The Key Point

At every step, ask yourself what you can do to “spoon-feed” the person viewing your project page. Show off your best screens in a way that makes them easy to see and understand for viewers.. Do you want to focus on a specific part of a screen? Add an indication to help me know which part you’re talking about.

For Example

Designer Simon Pan uses large, clear screenshots and arrows to present the main flow, making it simple for me to understand the sequence.

Closing the Loop

Like many stories, we end this one with an ‘Epilogue’. Here’s a brief summary of the story, the lessons Tamar learned, and some data to back it up (if possible). If I’ve piqued your interest, you can check out more projects — I’ve provided convenient shortcuts at the end of the page with a sentence about each project instead of just ‘previous/next project.’ I also included links to her updated LinkedIn profile and resume. That’s about it. I’m done here. So, what do you think? Interested enough to invite her for an interview?

The Key Point

Try to wrap up your project with a few words summarizing it. How was the experience working on it? What did you learn? What impact did it have? What other projects can I explore?

For Example

Miki Chernyak’s project pages end with a personal summary, a quote from a colleague, and a call to action to continue browsing his website.

In Summary

A UX portfolio has always been and will always be one of the most talked-about, sensitive, frustrating, complex, and challenging topics in our field. I tried to share some practical tips from my perspective, but remember, I’m just one user with one viewpoint. Question everything, ask yourself what’s right for your portfolio, research, test it with users, seek feedback, and keep improving it. Treat your portfolio like a product; by applying the same work processes, you’ll create an impressive result that serves its purpose — making a strong first impression towards the next step in your professional journey. Good luck!

Article edited by Julia Ronen

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

If design portfolios could talk, what would they say? was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.

From pixels to perfection — A new era of UI development

Lost in Translation

Here’s a scenario that should be familiar to any designer in the software industry: you’ve just finished working on a great design. Everybody’s happy with it: the other designers, the developers, the boss. Now it’s time to implement it, and make it into a real product. The developers show you their first version. And it bears as much resemblance to your original design as a Halloween cat costume resembles a real cat.

You try to fix this. You give the developers detailed instructions. Move this image two pixels to the left. Make that transition 0.2% faster. Change the border width on the button component. For every such change, you have to wait. The developers are great, but sometimes they don’t get your exact meaning, and other times the team has other priorities, and for weeks, or even months, you’re stuck in the same loop, just trying to make the product look the way you want it to.

Hi, I’m Anat, Head of UX at Codux. In the past few years I’ve been working at Wix as a Product designer, I’ve felt how we’ve been running through those challenges again and again. That’s why I was thrilled to help lead the effort of creating a solution, one that can give us designers control of our designs. This is why we built Codux.

Introducing Codux

Codux is a visual editor for React projects. It presents the project’s code in a visual editing environment, which allows designers to work on the actual source code without coding. This means no more endless ping-pong between you and the developers since your changes affect the code directly. It means no more guessing how the final product will look, as what you see is what you get. It means better communication between everyone involved — instead of long explanations and design documents you just focus on design. And it means that you don’t have to delve into the intricacies of Javascript and React — you just drag and drop, and make changes in property panels.

This sounds very nice in theory, but how is it in practice? Here’s my own experience, working as a designer, before and after Codux.

The Magic of Quick Fixes

The first time I used Codux was while working on a thumbnail component. I designed it in Figma, delivered it to the team, and wasn’t surprised to see that the resulting component was not how I intended. My initial course of action was exactly what you’d expect: I inspected the component both visually and using the browser’s Developer Tools, and compared what I found to my Figma design. This way I found that the padding, the colors and the shadows were incorrect, and the footer had the wrong border.

But this time, instead of talking with the developers and submitting a list of fixes, I was given the chance to use Codux. It was so exciting!

I did not need the browser’s Developer Tools anymore, or anyone’s cooperation. Opening the project in Codux, I could see for myself how and where the design was implemented in the code. I’m no coding expert, but it didn’t matter much, because the information was also presented with familiar visual displays and controllers. I could change the values of any parameter, any color, any border of the component, and my choices would become a part of the code. I could play with this component until it was perfect.

Which I did.

And the best part? It took only a few minutes.

With Great Power

Excited about my quick progress, I couldn’t wait for my fixes to become a part of the project on production. However, it became clear to me I still needed to learn a thing or two before utilizing the full power of Codux.

Dealing with code, even if you’re not a coder, means cooperating more closely with your developer teammates.

I had to get familiar with Git, which is used by all developers these days. Without getting into details, it allowed me to work safely on my own version of the product, have control on when and with whom I want to share my changes, and get reviewed by the developers in my team.

It took me a few minutes to get the hang of it, but eventually, proudly, I submitted my code — me, a designer! — to the project. What joy!

Well, again, turned out my joy was a bit premature. Dealing with code, even if you’re not a coder, means cooperating more closely with your developer teammates. Every project has its own internal coding conventions, and the same goes for teams and companies. But the good news is that all this makes communicating with the team much more streamlined and effective. For instance, you don’t call the component “Oh, this thumbnail over there” anymore. You call it BoardCardView, because that’s how it’s coded, and every person on the team knows exactly what you mean by that. So, no more confusing descriptions and having coders spend days on the wrong components.

All this may sound complicated, but in fact the learning curve isn’t very steep. Less than a day after fixing the parameters of my card component, the proper version was merged into the project’s code and went on to production. How’s that as an alternative to the endless please-fix-my-color/shadow/border cycle? How’s that for a non-coding designer?

The Deep End of the Pool

After my initial success, it still took a while longer for me to realize just how much this will impact the way I work. The deeper I got into the project, the more changes I made using Codux, it became evident that this was a paradigm shift.

As a designer, I prefer investing as much time as possible on design, and as little time on tedious bureaucratic tasks. Before Codux, I expended a lot of effort in explaining my design to the team, maintaining my Figma files, and trying to bridge the gap between Figma and the reality of the web. But Codux changed all that. Now, I can implement the changes in just one place, directly into the source code, and then immediately visualize their impact on the entire project.

By accessing the real project, I can understand my designs better, test faster, and experiment with new ideas and designs within the real constraints of the web. My processes became iterative, minimizing back-and-forth communication. And so my fellow designers and I can take on additional tasks, while the developers can concentrate on business logic.

The Future of Web Design

My experience working with Codux convinced me that it’s more than merely a helper for designers: it’s a tool for the entire development team. Not only is it simplifying and improving our collaboration, but it brings us together as a team. Suddenly it’s not just “you do the code, I’ll do the design”, but a work environment in which everyone’s equally involved with the product.

Codux was developed out of necessity, answering a real pain point for people of different professions using different terms and tools to define the same things.

Suddenly it’s not just “you do the code, I’ll do the design”, but a work environment in which everyone’s equally involved with the product.

Here on the Codux team, we proudly follow the long-time Wix tradition of making technical interfaces visually editable. Now that designers can build a product’s UI visually and directly into production-ready code, we’re ready to share this with the world. It’s currently in beta and free to use — we’ve already started to spread the word and there’s a rapidly growing community of people and organizations using Codux. I invite you to join it! You’re welcome not only as a user but as a collaborator too. We’d love to have your input, gathering feedback help us shape the best possible product. Together, we can build a more productive, inclusive, and effective future for web design and development.

Try out Codux

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

Discovering harmony in the designer-developer workflow was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.

Although usability testing and research before launching a product are extremely helpful, there are issues that only pop up once a product is being used. This is a case study of a feature we modified only after it was already live.

First, a bit of background on collection permissions

Collections are databases where Wix users store content when building their site. When we noticed a large volume of customer support tickets about collections, we knew we had to take action and design a better flow. Collections are commonly used for:

• Managing content to display on a site (i.e., properties for a Real Estate Company)
• Collecting submissions from website visitors (i.e., testimonials or feedback forms)
• Storing sensitive information (i.e., emails)

This is a case in which an unusual volume of customer support tickets helped us design a much better flow for setting permissions in one of our main products: collections. Together with UX Designer Admon Gal, we set out on a quest to make finding collection permissions as easy as possible for our users.

Depending on how a collection is used, users need to be able to change its permissions and privacy settings accordingly.

Too many support tickets is always a red flag

Over a 6-month period, we found 1,665 tickets related to issues with collection permissions.

Upon analyzing the data, we decided we could improve the following areas:

• Discoverability
• Terminology
• Transparency

It turns out that 60% of users were unaware of collection permissions. A lot of times, the user’s intent was to edit privacy settings, but they didn’t understand the connection between editing permissions and privacy settings.

Additionally, out of those who were aware of permissions, 25% didn’t know where or how to customize them without contacting support.

Improving discoverability for collection permissions

As UX professionals, we are constantly calibrating the importance of a specific feature within the user journey. What does a user need to know? When do they need to know it? When does information have to be visible, and when can it be less prominent?

Originally, our decision was to “hide” collection permissions under ‘Additional Settings’. We decided to reduce friction by hiding it behind a secondary tab, based on the assumption that most users wouldn’t need to customize permissions at all. But as Steve Jobs once said, sometimes “you can only connect the dots looking backwards.”

Once the feature was live, our initial assumption was proved wrong: most users did need to customize permissions. In fact, users tried editing the privacy of their collections, and they couldn’t understand the connection between permissions and privacy settings.

We started out with the following improvements:

1. Adding a new entry point to make the feature easier to find.
2. Renaming the feature to include the word privacy in order to match the user intent of editing privacy settings for collections.

Making collection permissions more intuitive

With collection permissions more discoverable, the next challenge was making the entire experience more intuitive and easier to use.

Originally, we split permissions into presets, thinking this would make it easier for users to set the right permissions for their collections with minimal cognitive load.

Each permission preset actually consists of four different sub-permissions:

• Who can view content in a collection
• Who can add content to a collection
• Who can delete content from a collection
• Who can update content in a collection

Over half of the users who contacted support didn’t understand the most important part of presets: their sub-permissions. So, it’s no surprise that most of them failed to customize them according to their needs.

Before contacting support, 7.6% users customized a collection permission. After contacting support, that number became 45.5%. This meant two things:

1. Many users needed to customize permissions
2. Users didn’t know how to customize permissions by themselves.

When simple becomes complex

By over-simplifying the experience–trying to use a short title and short description to explain presets–we were failing to adequately explain what a preset was.

The issue we had could not be solved by content alone. It was time for a complete redesign.

Our redesign had two main goals:

• Making permission settings easy to understand
• Simplifying the preset customization process

Based on our goals, we came up with the following improvements:

1. Turning ‘Permissions & Privacy’ into its own tab in the collection settings panel. This also gave us the additional space we needed to display sub-permissions for each preset.
2. Simplifying preset titles and changing how each was explained.
3. Making presets easier to customize by letting users edit sub-permissions to fit their needs.
4. Updating content and information hierarchy to make the flow more conversational.

How our UX methodology helped us achieve our goals

By carefully following UX methodologies, we were able to achieve great improvements through this project.

Research and analysis

Before designing a new user experience, we analyzed the volume of related support tickets as well as user actions before and after contacting support in order to understand exactly what the user intent was.

Based on our findings, we concluded that users were struggling to find and edit permissions, as well as what each permission meant.

Improvements and conclusions

We added a new entry point for ‘Permissions & Privacy’ from collections, and we also changed the design of the ‘Edit Collection’ panel to provide more accurate information upfront. Due to these changes, we saw a significant uplift in changes made to collection permissions without contacting support. This indicates that our changes helped improve discoverability.

We simplified the terminology throughout the entire experience and also updated the information hierarchy in the panel to provide better understanding of collection permissions. The UX and UI improvements resulted in fewer issues related to permissions reported to customer care.

Also, when customer care issues did occur, our customer care team spent less time explaining how to set collection permissions thanks to a more intuitive experience.

Thus, by adopting a user-centric approach, we came up with a solution that led to a more intuitive user experience with improved discoverability.

If you would like to read more case studies like this, make sure to comment below.

Special thanks to Noy Misgav for helping me organize and edit this article.

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

Case study: Designing a better experience for permissions was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.

Let’s start from the end. We shouldn’t need to make a case for web accessibility in any year, or at any time, because all online content should be accessible to everyone with no limitations. And every single person, whether they work in the tech industry, or are just using the internet to send emails or for social media, can help make this happen.

So now that’s out of the way, let’s talk about the what, why and how of web accessibility.

What is web accessibility?

Web accessibility means making sure that everything on the internet can be used by everyone, regardless of ability, and without constraints.

It sounds simple, but it’s not. For this to happen, we need to look at all the disabilities that are out there, and integrate the accessibility accommodations that each requires into our web content.

Taking all disabilities into account

When we talk about disabilities, we usually break them down into 5 categories:

• Visual
• Speech
• Hearing
• Motor
• Cognitive

Each of these categories include a wide and varied range of diagnoses which have different impacts on the way people use the internet.

Visual disabilities, for example, don’t just refer to people who can’t see at all. They range from near or long sightedness, to glaucoma, macular degeneration, color blindness, and all the way to complete blindness. Each of these visual disabilities impact the way a person interacts with the world around them, and obviously, with the web.

People with color blindness can’t see all the colors of the spectrum, so if a certain hue is used on a page to send a message, like red for “bad” and green for “good”, they might not be able to get it. People who are blind and use screen readers to interact with the web, won’t be able to navigate through a page, or understand what images are, unless the page is designed with proper page structure, content order, and alternative text for images.

Because the internet is mostly made of text and images, visual disabilities naturally pop into our minds when we think of disabilities that we need to accommodate. But they are not the only ones. For instance, a site visitor who is partially or completely deaf would need captions and transcripts to understand the videos on your site. Motor disabilities (like paralysis and tremors) often prevent people from using a regular mouse, so keyboard support is essential for them. People with cognitive disabilities like autism and PTSD can be distracted, and even triggered, by an overload of animations, different colors and fonts, so simplifying the design and limiting motion can really help them.

We can’t talk about accessibility without mentioning inclusion. Inclusion is about making as many people as possible comfortable with your content, and treating everybody equally, irrespective of ability, age, race, gender, sexual preference, class, economic status, and so on. By considering people who are different to us, and being sensitive to their experience, we can make sure no one is excluded.

Of course this is contextual. If you have a very specific audience you’re targeting, go ahead and target that audience, but if you’re focusing on a wider range of people, consider as many use cases as possible. For example, if you work at a school and are creating an online form for parents to fill in, don’t assume that everyone comes from a heterosexual family, and make the parent information gender neutral.

Sounds like there are a lot of factors to consider when making the web accessible, right? Well there are. But when there are more than 1.3 billion people with disabilities in the world, the web needs to adapt to accommodate them.

It’s not just “them”, it’s everyone

Every one of us experiences disability at some point in our lifetimes. Whether you have a permanent disability, or a temporary one, like a broken hand, or an ear infection, or even if something situational happens, like a loud parade going by while you’re trying to watch a movie, accessibility benefits us all. If I can’t use my hand to hold a mouse, being able to tap a button on the keyboard to navigate instead of the mouse, would be extremely useful. And if I can’t hear properly, captions on videos would really help.

We also need to remember that around 90% of disabilities are invisible. We all have friends, family members, neighbors and colleagues who have disabilities that we might not know about. Or even ourselves. ADHD, dyslexia and anxiety are just some examples of very common cognitive disabilities that most people who have them don’t even think of as disabilities.

Web accessibility is a basic human right

Web accessibility isn’t just a “nice to have”. According to the UN Convention on the Rights of Persons with Disabilities, “access for persons with disabilities to new information and communications technologies and systems, including the internet” is a basic human right. No one should be discriminated against because they have a disability, or prevented from doing something on the web just because someone didn’t know or simply didn’t care. It’s a common misconception that someone who is blind doesn’t need to know what a picture looks like because they can’t see it anyway. But who decides that? Let’s never assume what anyone can or cannot do. Present all the options, and let your users decide for themselves.

More and more countries are recognizing this and are putting laws into place that make web accessibility a legal requirement. But we shouldn’t be making the web accessible just to avoid lawsuits. We should be doing it because it’s the right thing to do, with no other considerations.

But why are there still web accessibility issues in 2023?

Over 97% of all websites aren’t accessible. The WebAIM Million 2023 report reviewed the accessibility of the home pages of the top 1 million websites and found that there are close to 50 million accessibility errors in the top 1 million homepages, an average of 50 errors per homepage. In an era where technology is constantly breaking new grounds, people with disabilities are still being denied access to even the most basic of services on the web.

One of the big problems with tackling known accessibility issues is that the cost of making inaccessible websites and products accessible can be huge, requiring time and resources that many companies aren’t willing to invest. The monetary benefit of making things accessible is hard to calculate, so fixing accessibility issues often takes a back seat. This is particularly true in the current climate where companies are extremely focused on their bottom line.

It’s also not the best way to do things. Adding accessibility into the end of the process is like baking a chocolate cake and only realizing that you’ve forgotten to add the cocoa in after it’s finished baking. You can try to add chocolate to the cake, but no matter what you do, it will never be a chocolate cake, it will just be a cake with chocolate.

What many people don’t realize is that when accessibility is considered from the start, creating accessible products is not that difficult or time-consuming. Making sure your product works with screen readers and keyboards, considering focus management, and content order (including tabbing order), and creating inclusive content which is structured properly, with descriptive links and alternative text for visuals, are all things that can be done quickly and easily, as long as you know what to do.

And when everyone involved in the product design and implementation process is aware of the importance of accessibility, it becomes just another part of the process. An important part, but still just another part.

So what can you do to help?

If you’re in the tech world, or are creating web or digital products, start by seeing how you can integrate accessibility into your processes from the beginning, instead of as an afterthought. Become familiar with WCAG, the international standards for web accessibility, and look at your processes to see what needs to be applied. Speak to your legal department to understand what your company needs to do to comply with accessibility requirements.

Even if your company or team aren’t onboard, see what you can do to make a difference. Promote accessibility awareness within your team, and start integrating accessibility considerations into your own workflows. Even the smallest changes can make a huge impact.

If you’re an individual, using social media, email, even your phone, to communicate, there’s a lot you can do with your content to make it more accessible to the people you’re interacting with.

• Use descriptive link text when sending a link in an email, so people with visual or cognitive disabilities can understand what will happen when they select a link.
• Add alt text to images you post on social media, or send in emails, so people using screen readers can understand what they are.
• Make sure your text contrasts well with the background you’re writing on, so people can read it properly
• Use words and terminology that as many people as possible will be able to understand.

There are so many more things I could recommend, but even implementing these few suggestions can make a huge difference.

In 2023 there’s no reason to make a case for web accessibility. It should be just another standard, like good grammar and spelling. Luckily, accessibility awareness is out there and is growing. Each of us just needs to do our part to achieve the ultimate goal, making the web an accessible and inclusive place for everyone, just as it should be.

What Wix is doing for web accessibility?

At Wix we’re committed to doing our part and making sure that our users can create accessible websites. We follow the “accessible by design” approach, considering accessibility from the start of the design process, and all the way to the final product. I’m a senior UX writer and accessible content specialist in Wix’s Accessibility Team. Our team works with everyone at Wix to educate them about accessibility, and to integrate WCAG requirements and best practices into all aspects of design and development.

I wrote this post to mark Global Accessibility Awareness Day (GAAD) which is on May 18 2023. In future posts I’ll deep dive into the world of accessible design and content, with practical tips for integrating accessibility into design and content systems, creating content that works for both sighted and non-sighted users, and more.

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

The case for web accessibility in 2023 was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.

Exploring AI’s impact on UX design and examining principles for building user trust

What people often refer to as AI is actually “Machine Learning” (ML), which is, in effect, an application of AI. This type of system began its wide and public use in the 1980s with examples like the well known “recommendations” section of Amazon. This technology is essentially a set of techniques used by computers to process information, to detect patterns, make predictions, and extract insights from vast amounts of data.

The ML model is often seen as a “black box”, as we currently lack the ability to fully understand and explain what happens to the data as it enters and exits its system.

The challenges

UX designers face many challenges when designing for AI. These include:

• How can we design user experiences that effectively communicate the use and benefits of AI to users, without overwhelming or confusing them?
• What strategies can be used to make AI more transparent and understandable to users and how can we give them more control over the decisions made by AI systems?
• How can we design interfaces that enable users to interact with AI in an intuitive way, while also providing them with the feedback and guidance they need to make wise decisions?

I’ll explore those challenges and suggest solutions, that can help ensure that AI is integrated in the most beneficial way for our user’s experience to help them achieve meaningful results.

Design principles to follow

It’s important to keep in mind that there’s a widespread confusion and lack of understanding around AI-based systems. To help overcome this we need to offer our users reliability.

“In UX design, trust is established by ensuring that users have control, are kept informed, and are treated with respect.” — Susan Weinschenk

It’s important to note that trust between humans and machines is different from other forms of trust, like humans-humans or humans-animals. To put trust in a machine we need to understand how it operates — and this understanding is limited. This is where we, as UX designers, have the ability to greatly contribute.

• Explain how and why

To increase users’ trust, we can give them some visibility into the algorithmic data that these AI systems use by explaining “how” and “why”.

The onboarding for Wix’s ‘Facebook & Instagram Ads’ is a great example of this. The designers chose to provide users with a clear and accessible glimpse of how the system works behind the scenes. They did this by explaining the technical operations that the system performs in order to help users achieve their goal. Additionally, users who want more information can view a detailed explanatory video.

People are more likely to trust when given reason. This is highly relevant to machines. As AI continues to become more widespread and advanced, it is essential that its decision-making process be made transparent to the users. Good design should not compromise transparency for the sake of creating a seamless user experience.

• Be honest

Don’t try to make users believe they are talking to a human when, in fact, they are interacting with a computer. This can be done by clearly indicating the presence of the machine. For example, by using a distinct icon. This will become increasingly important as technology advances and we see more realistic and human-like interactions (Check the case of the voice-based conversational AI product ‘Revoicer’).

• Let them be the boss

No one likes to be told what their preferences are. It takes away a sense of control, a crucial aspect to be considered in any product design.

“AI Text Generator’’ from Wix’s editor is a tool that allows users to answer a few short questions and receive custom-made content for their websites. The data that the system collects and presents to the user is not an absolute truth, meaning that the text may be far from what the user wanted it to be. Rather than presenting users with “content that suits them best” the designers chose to present the result as an option (pay attention to the terminology). They also presented three options to the users, to increase the chances of success in generating suitable content.

• Provide a way out

Despite its advanced capabilities, AI is not flawless. In situations where an AI system fails to provide a satisfactory outcome for its users, it’s crucial to provide them with alternatives and the option to modify the system’s decisions.

At Wix’s ‘Photo Studio’, an AI system allows users to remove a picture’s background. The product team anticipated that the automated cutting might not be perfect, so they provided users with the ability to make their own edits. After most of the work is completed, users can manually adjust the system’s inaccurate edges if needed. As they make these corrections, users can view previews to save time and streamline the process. This approach empowers users to fine-tune the AI system’s output and achieve their desired results.

Words in conclusion

Maintaining humanity is key when designing for AI systems. We need to remember that the purpose of technology is to serve people, not to restrict our humanity or take advantage of our weaknesses. It is also crucial to explain the system and its limitations, so users can appreciate its benefits. This will make it easier for users who are afraid of the unknown.

“UX design for AI needs to be driven by a deep understanding of user needs and behaviors, and a commitment to creating technology that serves the needs of people, rather than just the needs of technology itself.” — Pamela Pavliscak

Don’t forget to enjoy the great opportunity we have been given — to solve complex problems that designers have not yet had the chance to face.

Special thanks to the amazing women around me: Mor Chiprut Dahan ,Miriam Ginzburg and Adi Oren.

The features highlighted in this post are a testament to the hard work and talent of the Wix team over the years. Thank you all for your contributions.

Article edited by Miriam Ginzburg.

References

• AI Has Become a Top UX Design Challenge: Here’s How to Solve it, Walkme blog.
• UX for AI: The role of transparency, Aditya Giridhar.
• Artificial Intelligence — The Revolution Hasn’t Happened Yet, Michael Jordan.
• Explainability + Trust, People + AI Guidebook.
• Designing the User Experience of ML Products, Bastiane Huang.
• Designing for failure, not success with AI/ML, Sid.

Is there a topic you want to see covered by the Wix UX team? Let us know by filling out this form.

Creating a human-centered AI experience was originally published in Wix UX on Medium, where people are continuing the conversation by highlighting and responding to this story.