UX designer at JeelPay, Riyadh

I turn complex problems into simple interfaces. Designed for Arabic-speaking users first.

See my work Play with my skills

Selected work

Systems, research, websites and apps.

Under NDA, so names and data are left out.
01

Building a design system from zero

Fintech product

  • Design system
  • Tokens
  • Bilingual components
Read the case study 6 min read
02

Making expert tools make sense

Public-sector platform

  • UX research
  • Synthesis
  • Journey mapping
Read the case study 5 min read
03

From wireframe to live website

Company website in Framer

  • Web design
  • Framer
  • Responsive
Read the case study 4 min read
04

Less tapping, more done

Everyday mobile app

  • Product design
  • Usability testing
  • Arabic-first
Read the case study 5 min read

Skills you can touch

Tell me what you’re working on, or just pick one.

Design systems

I’ve built systems at JeelPay and AlRiyadh Company. Change a token and watch it ripple.

Theme preset
Accent color
Density 

            

            

              

                

                  
BS
Monthly plan
Renews on 1 December
Active

                  
                  

                  
Payment reminders

                  

                

              

            

          

        


        
        

          

            
Arabic-first, not translated later

            
Flip the screen. See what mirrors and what stays.

          

          

            

              

              
Same screen, both directions

            

            

              

                

                  
                  Send money
                  
                

                
Step 2 of 3Review

                

                
1,250.00 SAR

                

                  
                  To
                  Bana Shabib
                  
                

                

                  
                  From
                  Main account
                  
                

                

                  
                  Mobile
                  +966 5• ••• 4567
                  
                

                
              

              
    
                
  • MirroredArrows, chevrons, progress and row order.
    • 
                
  • Kept as isPhone numbers stay left to right.
    • 
                
  • AdjustedArabic gets its own font and line height.
    • 
                
  • Hover a note to spot it on the screen.
    • 
              

            

          

        


        
        

          

            
Responsive, mobile first

            
Small screen first. Drag the handle or pick a size.

          

          

            
Width 390 pxMobile

            

              

                

                  
                  

                    
Good morning, Bana

                    

                      
Balance, SAR4,820

                      
Paid this month3

                      
Upcoming2

                    

                    

                      

                      

                      

                      

                    

                  

                  
                

                

              

            

          

        


        
        

          

            
Micro-interactions and motion

            
Small, quick and tied to what you did.

          

          

            

              

                
                
Feedback that feels earned

              

              

                
                
One button, three states

              

              

                

                

                
Data that moves instead of jumping

              

            

          

        


        
        

          

            
Journey mapping and research

            
Pick a stage, then compare before and after.

          

          

            

              

              
            

            

              

                
                  
                    
                    
                  
                  
                  Happy
                  Frustrated
                  
                  
                  
                  
                  
                  
                
                

              

            

            

            
Illustrative example of a payments app

          

        


        
        

          

            
Accessibility and inclusive design

            
Real WCAG math. Try to break it.

          

          

            

              
Design for everyone

              
تصميم للجميع

              
Body text at 16px needs a contrast ratio of at least 4.5 to 1 to pass AA.

            

            

              
0: 1

              
    
                
  • AA body text 
    • 
                
  • AA large text 
    • 
                
  • AAA body text 
    • 
              

              

                
                
              

              
              

                
Try a pair

                
                
                
                
                
              

            

          

        

      

      
1 / 6

    

  







  

    

      
Where I’ve worked

      
Fintech, government and client work. Open a role for details.

    


    
    
      
  1. 
        
        
    
          
    Redesigning a fintech app and its design system.
    
          
      
            
    • Lead the full redesign of the JeelPay app.
      • 
            
    • Built the company’s first design system.
      • 
            
    • Set up workflows for smoother handoff.
      • 
            
    • Run usability tests and turn findings into fixes.
      • 
          
    
          
    • App redesign
    • Design system
    • Usability testing
    • Accessibility
    
        
    
      
    2. 
      
  2. 
        
        
    
          
    Helping clients ship products people get instantly.
    
          
      
            
    • Work directly with clients and developers.
      • 
            
    • Test ideas before anything goes live.
      • 
            
    • Design for how Arabic-speaking users really behave.
      • 
          
    
          
    • Client work
    • Lean research
    • Arabic-first UX
    
        
    
      
    3. 
      
  3. 
        
        
    
          
    Responsive websites, from layout to launch.
    
          
      
            
    • Designed and built responsive sites in Framer.
      • 
            
    • Built a design system to unify the UI.
      • 
            
    • Worked closely with developers through handoff.
      • 
          
    
          
    • Framer
    • Web design
    • Design system
    
        
    
      
    4. 
      
  4. 
        
        
    
          
    Bringing users’ voices into geospatial tools.
    
          
      
            
    • Mapped where people got stuck in complex tools.
      • 
            
    • Turned interviews and data into clear fixes.
      • 
            
    • Shared findings through stories and Figma mockups.
      • 
          
    
          
    • UX research
    • Journey mapping
    • Interviews
    
        
    
      
    5. 
    

  







  

    

      
Always learning

      
The Academy, a CS degree and a few certificates.

    


    

      

        
Apple Developer Academy, Tuwaiq

        
From my first SwiftUI screen to mentoring others.

        Selected for the second-year track for top graduates
      

      

        

          
          

          

          

        

        

      

    


    

      
Certifications
Tap a card to flip it and see what it taught me.

      

    


    

      

        
      


      

        
      


      

        
      


      

        
      


      

        
      

    


    

      
20202024

      

        
BSc Information Technology and Computing

        
Arab Open University, computer science track

        
  • Human-computer interaction
  • Design thinking
  • User-centered design

      

      
        
        
        
        EXCELLENT GPA ✦ ARAB OPEN UNIVERSITY ✦
        
      
    

  







  

    
Have a product that needs a designer?

    

      Banashbib@gmail.com
      
    

    

      +966 56 930 3613
      banashabib.com
      Riyadh, Saudi Arabia