WELCOME TO
CODE & DESIGN

UI/UX DESIGN | WEB DESIGN | WEB DEVELOPMENT

Good design is like a refrigerator—when it works, no one notices, but when it doesn’t, it sure stinks. Irene Au

ui and ux design services

UI/UX DESIGN

GREAT DESIGN MATTERS.
My job is thinking about the latest trend in design to make a perfect user interface for your website and applications. I enhance user satisfaction with your website by finding problems and creating solutions. Improve your website’s user interface by using the UX data.

Tools I Use:

  • Adobe Photoshop
  • Adobe Illustrator
  • Adobe XD
  • Adobe Premier
  • Adobe After Effects
  • Figma
  • Sketch
  • Invision
  • Zeplin
  • Milanote
web design services

WEB DESIGN

I always have been a big fan of colour and design from my childhoods, and technology has been one of my favourites from the first time that I saw a computer. I enjoy spending hours and think about the design, colours and shapes. Web design gave me a chance to have both sides simultaneously.

Tools I Use:

  • Adobe Photoshop
  • Adobe Illustrator
  • Adobe XD
  • Figma
  • Sketch
  • Invision
  • Zeplin
web development services

WEB DEVELOPMENT

My proven process produces results. Before starting any process, I get to know, what you want, your target market and, your audiences. Then I make a strategy and practical strategy that fits your business needs. After the coding process, I will run tests to make sure that everything is working correctly. Et voila, you now have a website that works perfectly.

Tools I Use:

  • Adobe Dreamweaver
  • Visual Code Studio
  • Atom
  • Notepad++
  • Github
  • Bootstrap
  • Wordpress
  • Material Design Lite

TECHNOLOGIES I USE

PORTFOLIO

FRONT END DEVELOPMENT

Goals: Modern Development Practices Using HTML5 and CSS3.

CSS Museum Mockup

DESKTOP VERSION

Used HTML5 and CSS3 to make this website, no media queries, it's a desktop version.

Positioning web mockup

DESKTOP VERSION

Used HTML5 and CSS3 to make this website, no media queries, it's a desktop version.

WEB PAGE TOOLS

Goal: Using different code editors like Adobe Dreamweaver, Using version control tools like Github and design strategies for Search Engin Optimization and mobile sites.

img/awesome-yoga-mockup.jpg

DESKTOP VERSION

Used HTML5 and CSS3 to make this website, no media queries, it's a desktop version.

Techply Mockup

RESPONSIVE DESIGN

Used media queries in different breakpoint to make a responsive website. HTML5 and CSS3 are used to code.

Photoshop and Illustrator

Goals: Using Photoshop and Illustrator for image manipulation, image optimization and, colour correction. Also, using these tools to make a workflow, site maps, wireframes and, mockups.

CodeMan Mockup

PHOTOSHOP PROJECT

Used PS for image manipulation, colour correction, text alignment and web optimization.

JSE Mediation Mockup

WIREFRAME AND PROTOTYPE

The goal was creating a site map, wireframe, mockup and prototype by using Photoshop and Illustrator.

Mobile and Responsive Design

Goals: Using HTML5 and CSS3 beside the frameworks like Twitter Bootstrap and technologies like SASS to make responsive websites for all platforms (Desktop, Tablet and, Mobile).

Codde and Design portfolio Mockup

BOOTSTRAP

The project is the current website. The goal was creating a responsive website by using Bootstrap.

League of Heroes Mockup

SASS PROJECT

The goal was creating a responsive website by using HTML and SASS.

JavaScript and jQuery

Goals: Using JavaScript and jQuery to make interactive user-interfaces and modern web pages.

Vanila JS Mockup

VANILLA JAVASCRIPT

The goal was making interactivity on web pages by using Vanilla JavaScript.

eart rate calculator Mockup

JQUERY

The goal was making a heartbeat rate calculator by using jQuery.

WORDPRESS SITES

WordPress customization and implementation.

Datis Wallpaper

Datis Wallpaper

Interior Design Company

eart rate calculator Mockup

KAVEH PIANO

Musician and Songwriter

eart rate calculator Mockup

BANKS APPROVE

Mortgage Agent

HAPPY CLIENTS