Redo my Custom CMS Dashboard in Figma with Old Xd File and Glow Up

Posted last week

Worldwide

Summary

Custom WordPress CMS Dashboard Glow Up These treatments will likely be complex for simple SVGs, they will need to be replicated using a combination of PhotoShop and Adobe Illustrator. The mocks attached are from AI and there is no source file for them. Redesign and modernize the administrative interface used within the WordPress back end from the custom layout we have today to move to Figma and match our mocks. The goal is to create a warmer, more polished, more modern user experience while preserving the practical structure and familiarity of the existing dashboard and web app management screens. This project will refresh the visual system, improve perceived quality, introduce personalized time-of-day theming, and create a scalable theme framework that can support multiple branded interface looks over time. Specific goals include: 1. Modernize the dashboard and web app interface with updated typography, spacing, gradients, card styling, and icon treatments. 2. Introduce a warm, personalized welcome experience based on time of day. 3. Create a flexible theme system that supports multiple visual themes. 5. Refresh web app icons with a cleaner glass-style visual treatment. 1. Aurora Theme Design It will use existing blue-green brand gradient as the foundation and will incorporate a northern lights and forest-inspired visual language. Aurora should feel polished, clean, calm, and premium. It should not introduce unnecessary color complexity. Aurora will include four time-of-day states: 1. Morning 2. Afternoon 3. Evening 4. Night Each time-of-day state will include both: 1. Light mode 2. Dark mode This results in eight Aurora design states: 1. Aurora Morning Light 2. Aurora Morning Dark 3. Aurora Afternoon Light 4. Aurora Afternoon Dark 5. Aurora Evening Light 6. Aurora Evening Dark 7. Aurora Night Light 8. Aurora Night Dark Each state will include custom visual treatment for: 1. Left sidebar 2. Dashboard introduction header 3. Time-of-day greeting 4. Background illustration or atmospheric graphic 5. Gradient usage 6. Contrast and readability adjustments 7. Icon and button accent treatments 2. Personalized Time-of-Day Greeting The dashboard will include a personalized greeting near the top of the main dashboard area, above the Web Apps section. Example greetings: 1. Good morning, Amanda! 2. Good afternoon, Amanda! 3. Good evening, Amanda! 4. Good night, Amanda! The greeting area should include subtle visual art appropriate to the active theme and time of day. This may include a horizon, sun, moon, forest line, stars, or other atmospheric elements depending on the theme. The greeting should remain subtle and should not overpower the functional dashboard content. 3. Light and Dark Mode Support Aurora will support both light and dark mode. Light mode should preserve the clean administrative feel of the existing interface while introducing updated gradients, softer card styling, refreshed icon treatments, and a more modern visual hierarchy. Dark mode should feel intentional and polished rather than simply inverted. It should include appropriate contrast, readable typography, softened borders, glass-like panels, and restrained use of glow or gradient effects. 4. Sidebar Refresh The left administrative sidebar will be redesigned while preserving the existing navigation structure. The new sidebar should include: 1. Updated Powerful logo placement and treatment. 2. Refined navigation typography. 3. Improved active state styling. 4. Updated icon styling where appropriate. 5. Notification badge styling aligned with the theme. 6. Subtle gradient or atmospheric treatment based on the selected theme. 7. Optional footer illustration or vector art tied to the theme. For Aurora, the sidebar footer may include a forest, lake, mountain, or northern-lights-inspired visual element. The illustration should be integrated with the gradient and should not compete with navigation readability. 5. Dashboard Header Refresh The top dashboard introduction area will be redesigned to include: 1. Personalized greeting. 2. Time-of-day visual treatment. 3. Theme-specific background illustration. 4. Smooth integration into the dashboard layout. The header should sit above the Web Apps panel and should feel connected to the overall interface rather than like a separate marketing banner. 6. Dashboard Widget Styling The dashboard widget boxes will receive updated styling. This includes: 1. Softer radius values. 2. Cleaner spacing. 3. Updated card shadows. 4. Refined borders. 5. Glass-like or translucent panel options where appropriate. 6. Improved header typography. 7. Updated collapse/expand controls. 8. Better alignment between Web Apps, At a Glance, Support, and other dashboard panels. The existing dashboard content should generally remain the same, but the presentation should feel more refined and modern. 7. Web App Icon Refresh The web app icons will be redesigned with a glass-style circular treatment. The current circular structure should be preserved. Icons should not become square cards. The refreshed icon system should include: 1. Circular icon containers. 2. Subtle glass or frosted treatment. 3. Consistent stroke weight. 4. Consistent icon sizing. 5. Theme-aware background fills. 6. Theme-aware icon colors. 7. Accessible contrast in both light and dark mode. 8. Clean hover and active states. 9. Avoidance of excessive color variation across icons. The icon system should feel cohesive and monochromatic within each theme, using the theme gradient and approved supporting colors.

  • $200.00

    Fixed-price
  • Intermediate
    Experience Level
  • Remote Job
  • One-time project
    Project Type
Skills and Expertise
Mandatory skills
Web Design
Adaptive Web Design
Activity on this job
  • Proposals:5 to 10
  • Last viewed by client:last week
  • Hires:
    1
  • Interviewing:
    1
  • Invites sent:
    0
  • Unanswered invites:
    0
About the client
Member since Aug 2, 2009
  • United States
    Portland4:27 PM
  • $249K total spent
    209 hires, 4 active
  • 570 hours
  • Tech & IT
    Mid-sized company (10-99 people)

Explore similar jobs on Upwork

User Interface Design
Graphic Design
Game Design
Prototyping
Style Guide
Mobile UI Design
High Fidelity Design
Wireframing
Responsive Design
Android
Gothic Video Game UI Design (PC, UE5)Fixed-price‐ Posted 1 month ago
Game Design
Graphic Design
Adobe Photoshop
Game Development
Illustration

How it works

  • Post a job icon
    Create your free profile
    Highlight your skills and experience, show your portfolio, and set your ideal pay rate.
  • Talent comes to you icon
    Work the way you want
    Apply for jobs, create easy-to-by projects, or access exclusive opportunities that come to you.
  • Payment simplified icon
    Get paid securely
    From contract to payment, we help you work safely and get paid securely.
Want to get started? Create a profile

About Upwork

  • Rating is 4.9 out of 5.
    4.9/5
    (Average rating of clients by professionals)
  • G2 2021
    #1 freelance platform
  • 49,000+
    Signed contract every week
  • $2.3B
    Freelancers earned on Upwork in 2020

Find the best freelance jobs

Growing your career is as easy as creating a free profile and finding work like this that fits your skills.

Trusted by

  • Microsoft Logo
  • Airbnb Logo
  • Bissell Logo
  • GoDaddy Logo