PMTNM User Experience & Aesthetic Critique
PMTNM User Experience & Aesthetic Critique
This document summarises observations of the Professional Music Teachers of New Mexico (PMTNM) website and tools from the perspective of a user experience (UX) and aesthetic critic. It aims to guide improvements for the next version.
General site design Strengths
Comprehensive functionality: The site offers robust tools for teacher profiles, shared lists, resource imports and recital programs. Many tasks can be completed without leaving the PMTNM ecosystem.
Consistent branding: The PMTNM logo, dark blue colour palette and navigation icons appear across pages, providing a recognisable identity.
Areas for improvement
Visual clutter in the navigation bar: The top navigation contains nine items with icons (Home, Profile, Links, Files, Lists, Browse Resources, Teacher Directory, etc.). Each link uses a different icon style (outlined, filled, badge), creating visual noise. On smaller screens the icons and text compete for space, making it hard to locate items quickly. Consider grouping related tools under a single menu or implementing a collapsible sidebar.
Inconsistent spacing and alignment: Elements sometimes float without alignment to a common grid. For example, buttons for Copy, Facebook, Create Slug, Manage, Export PDF, Add Resource, and Delete on the My Lists page appear at different vertical positions. Aligning buttons to a common baseline and adding uniform padding would reduce cognitive load.
Colour contrast and accessibility: The site uses dark blue backgrounds with medium‑blue buttons and white text. While aesthetically pleasing, some buttons (e.g., the pale blue “Show/Hide” toggles in the Recital Organizer) have insufficient contrast and may be difficult to see for users with visual impairments. Use a contrast checker to ensure all text and controls meet WCAG AA standards.
Icon meaning is unclear: Many controls are represented only by icons (e.g., a chain icon for Create Slug, a gift icon for Manage, a heart for likes). Without accompanying labels or tooltips, new users may not understand what each icon does. Adding tooltips on hover and using descriptive text next to icons will improve usability.
Lack of error feedback: During login, incorrect credentials simply reset the form without displaying an error message. Users are left guessing whether the problem is the email, password, or a system error. Implement clear error messages that describe the issue and provide guidance.
Intermittent 502 errors: Navigating to the Tools page occasionally results in a 502 Bad Gateway error. While this may be a server issue, it disrupts the user experience. Ensure the server infrastructure scales and implement graceful error handling (e.g., automatic retries or a friendly “Please try again later” message).
Terminology and labels: Terms like “slug,” “solo recital mode,” and “history” may not be obvious to non‑technical users. Provide brief explanations or links to help texts. For example, a small “i” icon next to the slug field could open a tooltip explaining that a slug customises the public URL.
Consistency across tools: The Recital Organizer, Shared Lists, and Resource Creation Guide each have their own design patterns. The Recital Organizer uses grey rounded buttons with blue highlights; the Resource Guide uses a white card layout; My Lists uses coloured buttons with icons. Unifying these patterns (common button styles, heading hierarchy, card layouts) will make the site feel cohesive.
Recital Organizer Positive aspects
Feature‑rich: The organizer supports manual entry, bulk import from spreadsheets, collaboration, custom slugs, public/private settings and archiving, covering most teacher needs.
Inline editing: Users can add, reorder, and remove entries directly on the page without modal dialogs.
Usability concerns
Hidden notes sections: Program notes, biographies and performer details are hidden behind Show/Hide buttons. Users may overlook these sections, thinking the fields do not exist. Consider expanding these areas by default or using a more noticeable disclosure arrow.
Slug field and share options: The optional slug and checkboxes (“Make this recital public” and “Allow edit by link”) are placed between the venue and performer sections. They are easy to miss, and there is no explanation of consequences. Adding explanatory text or a wizard for sharing options would help teachers understand how public sharing works.
Collaborators vs. share link: The difference between inviting collaborators and sharing a link is unclear. Collapsing these controls under a single “Share” button with a modal explaining the options (view only, edit, public) would simplify the workflow.
Programme import instructions: The “Instructions & samples” button opens a separate page with import instructions. It is easy to lose your place and unintuitive to navigate back. Consider embedding a collapsible panel or modal on the organizer page so users don’t leave their recital when reading instructions.
Warning before deletion: The Delete button permanently removes a recital without any confirmation dialog. Add a confirmation step to prevent accidental data loss.
Print size drop‑down: The print size selector defaults to “8.5 × 11” but does not display other options until clicked. A tooltip or label explaining its effect would help users adjust the program layout appropriately.
Shared Resources & Lists Strengths
Social elements: Users can “like” public lists, giving a sense of community engagement.
Slug creation: Creating a slug for each list encourages easy sharing and discoverability.
Improvements
Button overload: Each list card displays up to seven action buttons (copy link, share to Facebook, share to LinkedIn, create slug, manage, export PDF, add resource, delete). This overwhelms the user, especially when managing multiple lists. Group related actions under a menu (e.g., “Share,” “Edit”) or show only the most common actions by default, with an overflow menu for advanced tasks.
Like/heart icon placement: In the public view, likes appear as a floating heart at the top right of each list. For clarity, place the like button consistently near the list title and display the like count with text (e.g., “12 likes”) to improve readability.
Tagging interface: Adding or editing tags in the manage view is possible but not obvious. Consider an auto‑complete tag input with suggestions and clear instructions on why tagging matters (e.g., tags improve searchability).
PDF export formatting: The exported PDF sometimes truncates long titles and URLs. Allow users to preview the PDF layout or choose between condensed and expanded versions.
Mobile responsiveness: On narrow screens, the multi‑column layout of lists collapses inelegantly, causing buttons to wrap unpredictably. Test the design at various breakpoints and implement responsive styles.
Resource Creation Guide & ChatGPT integration Highlights
The guide includes a comprehensive “secret sauce” prompt for ChatGPT and clear schema definitions pmtnm.org .
Customisation tips (instrument, grade level, curriculum focus) encourage users to tailor their prompts pmtnm.org .
Enhancements
Discoverability of AI features: The link to the Resource Creation Guide is buried in a menu. Teachers may not realise that AI assistance exists. Promote the guide in the dashboard and include a quick‑start link on the Shared Resources page.
Interactive prompt builder: Rather than asking users to copy large blocks of JSON instructions, create an interactive tool where teachers can select categories, enter a topic, and generate a customised prompt automatically.
JSON validator and preview: Provide an integrated JSON validator and preview in the importer so teachers can see how their lists will appear before publishing.
Demonstration videos: Short screencasts showing how to use ChatGPT to generate lists and import them could reduce anxiety for new users.
Safety warnings: Emphasise that AI‑generated content should be vetted for accuracy, accessibility and appropriateness. Encourage users to follow the quality guidelines for source credibility and content balance pmtnm.org .
User Profile & Directory
The “Make my profile public” checkbox is easy to overlook in the profile edit form. Place it near other contact preferences and clarify that enabling it will list the teacher in the public directory.
After saving, there is little feedback. A toast message confirming changes or a link to view the public profile would reassure users.
Conclusion
PMTNM offers powerful tools for music educators, but the next version could greatly benefit from a streamlined interface, improved accessibility and clearer guidance. Reducing visual clutter, adding tooltips and confirmations, and consolidating actions will make the site more intuitive. Enhancing the AI integration with interactive helpers and quality safeguards will empower teachers to contribute high‑quality resources confidently. With these improvements, PMTNM can deliver a more polished and user‑friendly experience while maintaining its rich functionality.