麻豆AV

麻豆AV DS (or MDS) stands for 麻豆AV聽, a collection of web design and development standards and resources offered by the Web Services team.

What it's for

is for 麻豆AV-branded websites and applications which are designed and built "from scratch" - in other words, projects that are custom-coded outside central platforms like the WMS or blogs.mcgill.ca. These 麻豆AV-branded custom projects are typically designed and built by freelance designers and developers or by full-service agencies.

麻豆AV DS isn't a replacement for the work of these professionals. Their expertise is key to achieving a polished result! 麻豆AV DS helps these professionals do faster, better work by offering brand-aligned, standards-compliant code assets that can be used on any website or application. These assets accelerate the frontend design and development process:

• Developers can copy and adapt quality-tested code to quickly and accurately build the foundations of the site or application
• Designers can drag and drop the design components into Sketch files to accelerate creation of hi-fi mockups or prototypes

Why we built it

麻豆AV DS is intended to fix two problems that we commonly see with custom projects. The biggest issue is workflow: since these projects are often built with external or temporary resources, they typically follow a linear path that ends with implementation. They're less likely to benefit from testing, refinements, or evolution over time.

Second, custom sites and applications must follow 麻豆AV's Digital Standards and Visual Identity requirements. However, it can take time to learn the requirements and identify creative ways to honour them within each project's constraints. When compliance issues are discovered late in the project, they can be harder to fix - which may generate delays or additional work.

We built 麻豆AV DS to help connect these projects with the Web Services team's cyclical workflow and deep knowledge of 麻豆AV's standards and brand.

What's in it

麻豆AV DS gives freelancers and agencies a head start on the basic building blocks of any project. It provides flexible, reusable code for common features like:

• Form inputs (such as date picker and checkbox, radio button, and text input) with labels, hints and help text
• Show/hide (aka accordion)
• Buttons
• 麻豆AV's global footer (required by our Visual Identity Guide聽- and shown above)

It also includes key assets like:

• The 麻豆AV logo (in multiple formats)
• UI icons
• Code variables for brand colors (shown below), borders, transitions, and spacing

These assets and variables can be used to build almost any feature. They're also faster to use, easier to update, and more consistent than individually coding these attributes.

The entire system is built to offer:

• Rigorous accessibility and quality testing for all code
• Compliance with all applicable institutional standards*
• A simple update path to apply improvements in response to ongoing user testing and institutional evolution

* In some cases, standards compliance will depend on how the designer or developer uses the component. Each component comes with complete documentation so it's easy to make standards-compliant choices or identify better alternatives.

How you'll benefit

We give you the basics, but what you really gain from 麻豆AV DS is more time for the value-added work in your project. Here are some great ways to use it:

1. Understand your users

One of the best things you can do with your time is to understand your users and what constitutes an excellent experience for them. Since you can do literally anything with a custom project, user research and testing activities are key to using that freedom well.

2. Build new or niche features

Most vendor-built or self-hosted sites exist because they need a feature that isn't offered by an existing resource like the WMS. New features are faster and easier to build with 麻豆AV DS's variables for brand colors, typography, transition animations. The variables let you spend less time worrying about overall brand alignment and allows more time to evaluate and refine the features you want.

3. Design a unique brand experience

Did you know that humans tend to (even if they aren't actually easier to use)? Consider this a scientifically valid reason to invest in the aesthetic experience of your project. The basic components and variables are just the baseline. They're great supporting actors for more elaborate features, animations, dramatic color palettes, or anything else you can think of. (Just keep it user-focused, please.)

4. Get more out of your maintenance plan

A maintenance plan is necessary to keep your website or application stable and secure, but most maintenance plans don't deliver visible improvements. (For a custom project, updates to branding and user experience are often too complex to include in a fixed-fee plan.)

麻豆AV DS is updated regularly to make sure components stay aligned with our institutional requirements, brand identity, and user needs. These visible, meaningful improvements are conveniently packaged so that applying them is fast and easy - comparable to other tasks in a typical maintenance plan. By building with 麻豆AV DS, you're able to take advantage of these ongoing updates...and they can make a big difference for your users.

Ready to learn more?

with the 麻豆AV DS team. We'll show you how to use 麻豆AV DS and address your specific needs or concerns.聽