Articulate Design Co

0 views
Skip to first unread message

Algernon Alcala

unread,
Aug 3, 2024, 3:41:59 PM8/3/24
to icmocivent

LinkedIn and 3rd parties use essential and non-essential cookies to provide, secure, analyze and improve our Services, and to show you relevant ads (including professional and job ads) on and off LinkedIn. Learn more in our Cookie Policy.

As a Junior UX Designer, it can be hard to know affective ways to communicate your design decisions. Having explored a number of different ways myself, I wanted to share with you all three tricks that I have found helpful!

Instead, think about other ways you can share that information. For example, think about using the data in more of a story form, rather than a slide with numbers. This way you can still highlight your reason for why your solution is better, without scaring your audience.

I usually have these other mockups ready to share so that the visual can help back up my reasoning for why this said solution is not right for the users at hand. Showing something visual usually allows your stakeholders to also see why it is wrong themselves, and let them move forward with your proposed solution.

I want to be clear here though, I am not telling you to prepare your answers word for word. Rather, I am talking about preparing a few bullet points you want to cover per question. You still want to sound natural and conversational!

Next time you are preparing for a meeting with stakeholders, think about these three tips! Although they will not guarantee your stakeholders agreement, I promise they will help you feel more confident in your meetings!

There are many similarities between curriculum design aimed at university students and professional members of the workforce interested in upskilling or keeping current. Thinking about your audience is the most important part of understanding these differences.

Designing for students means lots of details and clear instructions; assessments matter more; and the time students devote to your course enables you to build complex projects into the curriculum in support of learning outcomes.

But designing for professional development means designing not for holistic education, but for intermittent or periodic education. It requires simplicity driven by responsive access, because these adult, employed learners have less time, but they already have a high degree of knowledge of the world. They are more self-paced and self-motivated learners, too, which means you can rely on them to follow up, click links, and dig a little deeper.

One of the barriers I've encountered within UI design is a blurred distinction between implementing proven design principles and a designer's judgment for aesthetics and style. I would like to know how to best articulate these different influences when discussing within a team, and with stakeholders? With the goal being, to improve one with minimal impact to the other.

A UI Designer creates a new comp. Technically it's sound, and there really are no usability concerns. The designer has even factored in proven design principles such as the Golden Ratio or Fitts Law. Everything is great, and we could move forward with making a good product, except... it could look better. The design team is attached and thinks it does look good. After all, it uses the Golden Ratio! So how could it not? The stakeholders are impressed, the developers are on board, so what is left to critique without nitpicking?

A UI designer comes up with a slick, shiny, impressive visual UI design as a high-fidelity mock-up. This would be impressive on dribbble or any other established gallery. While they didn't use the Golden Ratio, they used their own judgment, and they're talented enough that it still looks amazing. The design even includes common, familiar, UI concepts. So stakeholders are impressed, and developers are excited to get started. Everyone is enamored by what they see. But now the problem is, it could work better.

I think it is best to marry these separate influences as seamlessly as possible, to make one final amazing product. But in my experience teams tend to focus disproportionately on one over the other. Sometimes to the point of sacrificing valuable quality in one area of potential influence.

This is exactly why you build wireframes separately from look-and-feel work: it makes a very clear separation between these two separate concerns, and ensures you do them in the correct order -- because, as you point out, it's far too easy to mistake an aesthetically beautiful design for one that actually functions properly.

Wireframes themselves can come in a couple of sub-stages, it's generally best to start with the overall structure and rough interaction design, before handling the layout, grouping of controls, and proportions of page elements in a second pass.

Only after those concerns are nailed down should the aesthetics, look-and-feel, styling work begin. Layout ratios and proportions can still be tweaked at this stage, it's not paint-by-numbers work, but if you find yourself doing any large-scale rearrangement of features it's time to go back to wireframes until you've sorted it out.

Visual limitations cover a broad spectrum, including low vision, color blindness, and total blindness. Learners who find it difficult to read on-screen text due to learning disabilities or because the course language is not their first language can also benefit from more accessible visual content.

Some learners with visual limitations use screen readers to navigate e-learning courses. Storyline 360 supports popular screen readers like JAWS, NVDA, VoiceOver, and TalkBack with our supported browsers. Some learners may rely solely on keyboard or keyboard alternatives to navigate content. (Click here for information on how your learners navigate slide content with a keyboard or screen reader.)

The focus order you set for each slide controls the reading order for screen readers and the tab order for interactive elements like buttons, hotspots, and data entry fields. Customizing the focus order to ensure that screen readers present the content logically and intuitively enhances the learning experience for users with visual disabilities.

Setting the course language allows screen readers to interpret and present the content accurately. Storyline 360 automatically adds a language code based on the language you selected for your text labels to the story.html file when you publish your course. This flexibility allows you to create tailored experiences for diverse audiences.

Screen readers use text labels to describe buttons, messages, screen reader instructions, and other player controls. You can easily customize your text labels with specific terminology and phrasing. This customization can help learners better understand the content, especially if the default labels don't align with your course's context.

Allowing learners to skip repetitive navigation elements in your course benefits keyboard-only users and screen reader users. The skip navigation shortcut button can be accessed by pressing the spacebar or Enter key to return to the top of the slide once the last object on a slide is completed. Learners can choose to bypass all player controls, or they can press the Tab key to proceed to the player controls.

As the course author, you have complete control over the size of the slide text. Ensuring that player elements such as buttons, sidebar tabs, and pop-up messages are easily readable for all learners is essential. In your player settings, you can set the font size to any percentage between 75% and 200%. This flexibility allows you to tailor the player font size to keep all text clear and legible for everyone in your audience.

Rely on text, not images, to communicate important details. If you need to use images or animations to share essential context, offer text-based alternatives for learners with blindness or limited vision. For example, use alternative text to describe images or add an optional link to an animated slide to open a static, text-based layer with the same information for learners using screen readers.

Non-text content needs alternative text (alt text) to describe its meaning to learners using assistive technologies. Add alt text to objects that convey meaning or context to the learner. Purely decorative images and shapes can be hidden from accessibility tools to prevent unnecessary announcements that can fatigue screen reader users.

Captions and detailed descriptions provide additional context, especially near complex images like charts or diagrams, and ensure that all learners, including those using screen readers, can fully understand the content. Offering text descriptions also benefits users with visual disabilities and those with difficulty interpreting visual information.

Audio and video content can present challenges for learners who are deaf or hard of hearing, have cognitive disabilities, or those who are non-native speakers of the course language. Making audio and video content accessible ensures inclusivity and enhances comprehension for a wider audience.

People using screen readers navigate by listening, so audio or video content that starts playing automatically can be disruptive. To manage their learning experience, let your learners control playback. Here's how to adjust video properties to prevent autoplay and allow learners to choose a playback speed.

Enable the accessible video controls in Storyline 360's modern player for a more inclusive experience for all learners. These controls ensure that all users, including those with disabilities, have maximum flexibility when consuming video content.

Storyline 360 lets you position captions at the top or bottom of your slides and customize the foreground and background colors to maximize readability. The output also supports Live Caption in Google Chrome.

Transcripts also convert audio into written text, but they differ from closed captions, which appear in time-coded frames as a comprehensive alternative to audio content. Synchronized video transcripts can be automatically generated from closed captions and should also include descriptions of narration, sound effects, and other audiovisual elements. Including these elements boosts accessibility for all learners, especially those who are deaf or hard of hearing or prefer reading over listening.

c80f0f1006
Reply all
Reply to author
Forward
0 new messages