Portfolio Presentation_3

Portfolio Presentation
Howard Tibbs III
Adaptable
Driven
Analytical
Technology
609-442-1473 (Cell suspended
temporary)
609-287-3025 (Temporary Cell)
Traesta@comcast.net

Outstanding Career
Accomplishments
TSPRG Server Portal
Philadelphia Pediatric Medical Device Consortium Website
Cystic Fibrosis Website
Howardtibbs.com
Howard Tibbs -Adaptable, Driven, Analytical,
Technology

TSPRG Portal
Project Description:
Howard Tibbs created a server portal for the Terminal Surveillance
Performance and Registration Group (TSPRG) project. A portal was needed in
order to maintain project documents and data.
Inspiration and Design:
The design and structure of the portal was discussed with a Project Lead. The
objective was to create another directory in a much bigger externet portal and
to use the design of the other pages to create the TSPRG portal.
Project Progress:
The original TSPRG portal pages were created using PHP, HTML, and CSS. The
portal worked but it was honestly a mess. The main issue with the page was
that it was not organized and lacked an easy to read and understand design.
--> continued next page
Technology

TSPRG Portal cont’d
Project Progress cont’d:
So he used a CMS system called CMS Made Simple in order to redesign the
design. It provided a better look, organization, and functionality of the
overall site.
Final Design:
The final look of the site was without question an update to the old portal,
with a briefing on the main page, a better working log-in and registration
page, clearer navigation and better radar site page.
Technology

TSPRG Portal
Wireframe
•Used Lumzy to
create a wireframe of
how the site would
look.
•Original portal was
created without the
wireframe, however
helped inspire the
new design.
•Mapped out the
navigation of the site
as well as working
pages and links.
Technology

File Server Main
Page
•This is the main page of
the server page, where
many other portals are
linked to.
•The user clicks on the log
in link below for Terminal
Surveillance Performance
and Registration
Group(TSPRG) Portal.
•Takes you to a log in
screen for people who are
registered.
Technology

TSPRG Portal Log In
page
•This log in page connects
users to the main TSPRG
page.
•There’s a link on the top
right for new users to
create their own profile.
Technology

TSPRG Portal Main
Page
•This is the main page
where displays everything
that we need for our tasks.
•The left hand side are the
radar sites that we store and
retrieve documents and data
received from them.
•Below that are the outside
links to a different portal site
and contact listings.
•On the right are the Project
pages that we store many of
our project related items.
•Below would be where
users would contact the
administrator of the site.
Technology

TSPRG Portal Site
page
•This is where we store the
site specific data by site.
•We have the site name or
city followed by the three
letter identifier and then
the level of risk that the
site is currently on.
Technology

New TSPRG Portal
admin page
•This is the CMS Made
Simple admin page,
customized and created
specifically for TSPRG.
•It provided a better look,
organization, and
functionality of the overall
site.
•Compared to the old
portal site, this held
everything together from
users to uploaded files, to
even CSS scripts and
backups.
Technology

New TSPRG Portal
Login Page
•This is an improved
version of the login page
from the old portal.
•You login as you normally
would, however this time
now you input a captcha
pattern to verify if the user
is a real person.
•Another improvement
from the previous is the
forget password/login
details links.
•On the next to last link
below is the TSPRG Portal
Register link for new users.
Technology

New TSPRG Portal
Register Page
•This is where you register
for the portal site.
•You input all of your
information into these text
fields and it stores all that
info into the database .
•This also includes a
captcha pattern for spam
detection.
Technology

New TSPRG Portal
Main Page
•This is the main page of
which is similar to the old
page, however now the
menu items are organized
on the left hand site with
the middle body displaying
the page’s features.
•Also this includes a
breadcrumb to navigate
where you are in the site.
•Also included is a search
bar above which searches
for specific items
throughout the portal
Technology

New TSPRG Portal Action
Items
•This is an example of the
many pages on the left.
The Action Item page is a
collection of action items
throughout the project
•Up top folder are the
Action Item Archives where
we store action items from
the past years.
•Below that are the most
recent action items within
the week.
•Below that is a link for
users to upload their own
action item files.
Technology

New TSPRG Portal
Upload page
•This is the upload page
where users are able to
upload their files into the
directories.
•You input the file using the
browser menu, then type in
the description of the file.
•If you want to rename the
file or add thumbnail, you
can do here.
•This also has a captcha
which makes sure you are
a real user.
Technology

New TSPRG Portal
POC List
•This is the POC List or
also the contact list of
project members
•Up top are the archives,
while below are the most
recent POC List for that
particular day.
•This also has an upload
link to the page.
•This is a list of members
as it would display in the
POC List
Technology

New TSPRG Portal Site
Page
•This is an improved
version of the site page in
the old portal.
•Everything is the same
here
Technology

New TSPRG Portal Site
Page cont’d
•This is an example of a
site that we collected data
from.
•We include reports, data,
illustrations, etc .
•Also has an upload page
for files.
•Below is a map of the
location where we could
take a look at the site and
also if there are markers
included examine them.
Technology

Philadelphia Pediatric Medical Device
Consortium
Howard Tibbs designed a CMS website for the Philadelphia Pediatric Medical Device Consortium.
The Philadelphia Pediatric Medical Device Consortium or PPDC aims to assist pediatric medical
device innovators along the pathway from concept to commercialization.
The inspiration to the design was based on many of the nationwide pediatric medical device
websites. The inspiration, design, and structure of the website was discussed with the project
manager and all stakeholder clients.
Project Progress:
There were some ups and downs, but the project was finished and the clients were satisified with
the end result of the website. The website was created using Joomla! CMS system with a T3
framework.
Final Design:
The final design as mentioned came out very well and the clients were able to work with the
backend of the site. You can view the website at PPDC
Technology

PPDC Inspiration
pages
•These are some inspirations
to the website. The logo
design idea came from the
Atlantic Pediatric Device
Consortium.
•The images gave me an idea
of where the website direction
will go.
Technology

PPDC
Wireframe
•Here is an example
wireframe of the front page.
•The top is where the
website’s banner will be.
•At the hero section, we
wanted to have a slider that
displayed news, important
information and events.
•Below we have buttons that
go to Individual Innovators,
Small Businesses, and Large
Corporations
•At the footer, this is where we
include the logos of the
collaborators CHOP, UPenn,
and Drexel
Technology

PPDC Final
Design
•This is the final design of the
website.
•Overall I like the website, has
a nice clean look to it and
enough spacing to not seem
too crowded.
Technology

Cystic Fibrosis Related
Diabetes Research Studies
Howard Tibbs redesigned a website for a client representing Cystic Fibrosis Related Diabetes
Research Studies organization. This is a research study project that focuses on Cystic Fibrosis
Related Diabetes in young infants.
As the website was predesigned by a colleague, the website was in need of a redesign and a
restructure of the content. This was discussed with my project manager and the clients.
Project Progress:
The website pages were coded in PHP, HTML, and CSS. The redesign was coded using the
same programming, but added a few jQuery charts as well.
Final Design:
The final design was indeed colorful, but it was more compact and organized in reference to
the content and navigation.
Technology

Cystic Fibrosis
Wireframe
•Here are some wireframes of
the pages on the website.
•This was apart of the
redesign of the website to
organize where everything will
go.
Technology

Cystic Fibrosis Final
Design
•This is the final design of the
website.
•I like the website, compact,
organized, and to the point.
Technology

Other Career
Accomplishments
Healthy Heart Study Website
Created TSPRG Procedure Manual
Created Prototype and provide QA for Lat/Long Calculator
Provided Maintenance and Administration to IPP
Technology

Other
Accomplishments/Projects
• Volunteered with International Professors Project
http://www.internationalprofs.org/
• Currently apart of the FreeCodeCamp and looking to
continue my education.
• Will continue freelancing, competitive coding, and other side
jobs.
• Also stay in tune with the latest technology trends and
programs
• Actively self learning in online course sites such as Udacity,
Udemy, Coursera, Code Academy, etc.
Technology

Questions?!
• Is there any thing else you want to know about any of my
accomplishments?
• How may I help you?
Technology

Portfolio Presentation_3

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (20)

Ähnlich wie Portfolio Presentation_3

Ähnlich wie Portfolio Presentation_3 (20)

Portfolio Presentation_3