Foday Kargbo's profile

CMS User Interface Design (High Fidelity)

Role:
Designer
Researcher
UI/UX
Wireframing
Art Direction
Wire-frame drawing for the Home panel of the CMS.
CMS Home panel with main left navigation expanded. The same options found on the left navigation are also found on the main display area. On mouseover the question marks, a floating window with explanation for each tab will appear.
CMS Home panel with main left navigation collapsed to gain more screen space.
Close-up on Home panel icons.
Wire-frame drawing for the Content Mgmt. panel.
Page-type selection panel with "Content Page" selected introduces a Select your layout option panel. You can preview a high fidelity layout sample via a pop-up window by clicking on the "Preview" button. When you click on the "Select" button a tertiary interface window will appear allowing you to name your page and set you page linking accordingly.
A close-up of the Page-type selection panel. This where you choose the type of page you'd like to add.
Page layout thumbnail close-up.
"Select" button dialog box close-up. Upon clicking on "Select" the tertiary interface window now showing will be introduced to the user.
 
Edit Content tab. Images and text can be edited on pages selected via the tree structure.
 
Edit Content tab close-up. You can Save, Preview or Display the changes you make on your page via these button options.
 
Close-up on Edit Content tab.
General Settings tab. Page-type and various other settings can be changed or adjusted on this panel.
General Settings tab close-up.
Wire-frame for the Image Bank panel.
CMS Image Bank interface with multiple image selection features (Grid View). This is where you manage your image files. Images will be uploaded here either one at a time or via multiple uploads. You can still access this images through individual pages where you would them to show.
 
 
CMS Image bank interface close-up.
Image Bank panel with listed-view selected.
CMS Image Bank interface close-up (Listed-view selected).
Multiple image upload in progress showing a few active progress bars.
Multiple image upload progress bars close-up.
Various dialog boxes on the Image Bank panel. This image is showing the various tertiary windows that pop up when you click on "Add Image", "Add Multiple Images", "Delete" and "Move" buttons.
Image Bank tertiary windows close-up.
Image Bank dialog boxes close-up continued.
CMS Client Mgmt. tab; eCommerce settings.
CMS Client Mgmt. tab; eCommerce settings close-up.
CMS Client Mgmt. tab; Orders settings.
CMS Client Mgmt. tab; Orders settings close-up.
CMS Client Mgmt. tab; Orders settings close-up continued.
CMS User Interface Design (High Fidelity)
Published:

CMS User Interface Design (High Fidelity)

Design for a robust CMS system used by a website hosting agency. Users can select simple to complex templates with the ability to fully customize Read More

Published: