Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion docs/about/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -184,14 +184,15 @@ <h2><a href="mailto:[email protected]" target="_blank">[email protected]</
<div>
<p class="caption">Skills</p><br>
<p><strong>Strong working knowledge of:</strong><br>Illustrator, InDesign, Photoshop, Figma, Premiere Pro, After Effects, Keynote, Glyphs, Blender</p><br>
<p><strong>Familiar with:</strong><br>Midjourney, TouchDesigner, MadMapper, LiveSurface, Webflow, Squarespace, Cargo, WordPress, Artivive, Basecamp, Trello, Jira, Google Workspace, Microsoft Office, Dropbox, Slack, Twinmotion, Rhino, SketchUp</p><br>
<p><strong>Familiar with:</strong><br>Affinity, Midjourney, TouchDesigner, MadMapper, LiveSurface, Webflow, Squarespace, Cargo, WordPress, Artivive, Basecamp, Trello, Jira, Google Workspace, Microsoft Office, Dropbox, Slack, Notion, Google Analytics, Twinmotion, Rhino, SketchUp</p><br>
<p><strong>Presentation and facilitation:</strong><br>Strategic thinking, collaboration, copywriting, product management, project management, community building, agile facilitation, scrum</p><br>
<p><strong>Programming:</strong><br>JavaScript, p5.js, Processing, Node.js, HTML, CSS, Python, Java, C, C++, Git</p>
<hr class="mobile-only">
</div>
<div></div>
<div>
<p class="caption">Recognition</p><br>
<p><strong><a class="underline" href="https://www.wallofportfolios.in/portfolios/shakeel-mohamed/" target="_blank">Wall of Portfolios</a></strong><br>Featured Portfolio<br>2025</p><br>
<p><strong><a class="underline" href="https://www.bestfolios.com/portfolio/shakeelmohamed" target="_blank">Bestfolios</a></strong><br>Editor’s Pick: Portfolio<br>2025</p><br>
<p><strong><a class="underline" href="https://www.linkedin.com/posts/lithographix_artcentergx-activity-7333914789993160705-A71a" target="_blank">Lithographix ArtCenter Alumni Gallery</a></strong><br><a class="underline" href="../projects/mark-rothko">Mark Rothko Documentary Poster</a><br>2025</p><br>
<p><strong>The Planetary Society</strong><br>Two&nbsp;<a class="underline" href="../projects/planetary-society">Planetary Society Rebrand</a>&nbsp; posters selected for display in their headquarters.<br>2025</p><br>
Expand All @@ -201,6 +202,7 @@ <h2><a href="mailto:[email protected]" target="_blank">[email protected]</
</div>
<div>
<p class="caption">Speaking</p><br>
<p><strong><a class="underline" href="https://www.linkedin.com/posts/activity-7376647120025694208-nPWb/" target="_blank">AIGA Design Conference (national)</a></strong><br>Ask Us Anything 3.0: Dr. Cheryl D. Miller and Invited West Coast BIPOC Best Performing Designers<br>2025</p><br>
<p><strong><a class="underline" href="https://www.instagram.com/p/DKiB81WBxfX/" target="_blank">Work in Progress</a></strong><br>Presented my&nbsp;<a class="underline" href="../projects/ontology/">Ontology</a>&nbsp;typeface project to 30&nbsp;designers.<br>2025</p><br>
<p><strong><a class="underline" href="https://www.instagram.com/p/DBzlhkMtHik/?img_index=2" target="_blank">AIGA Los Angeles: Graphic Content&nbsp;(conference)</a></strong><br>Deconstructing “Best”: Redefining Success for&nbsp;Designers<br>2024</p><br>
<p><strong><a class="underline" href="https://www.instagram.com/p/CqJdQNfPx1P/?utm_source=ig_web_copy_link&amp;igsh=MzRlODBiNWFlZA==" target="_blank">Type Thursday Los Angeles</a></strong><br>Presented my&nbsp;<a class="underline" href="../projects/typo-mexico-city/">TYPO Mexico City</a>&nbsp;branding project to 30&nbsp;designers.<br>2023</p><br>
Expand Down
19 changes: 9 additions & 10 deletions docs/dist/tailwind.css
Original file line number Diff line number Diff line change
Expand Up @@ -714,8 +714,7 @@ select {
.newheader {
z-index: 999;
background: rgba(255, 255, 255, 0.9);
-webkit-backdrop-filter: blur(1rem);
backdrop-filter: blur(1rem);
backdrop-filter: blur(1rem);

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

issue (bug_risk): Removing the -webkit-backdrop-filter prefix may regress blur support on Safari and some iOS versions.

Given some Safari/iOS versions still need the prefixed property for blur to work reliably, consider keeping both declarations:

-webkit-backdrop-filter: blur(1rem);
backdrop-filter: blur(1rem);

This preserves compatibility while relying on the standard property where supported.

margin-top: -2rem;
padding-top: 1.5rem;
Expand Down Expand Up @@ -1126,9 +1125,9 @@ select {
a {
/* TODO: might be nice to do a different transition, box border trace? */
/* example: https://codepen.io/mehi/pen/MyWqPM; */
transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
Expand Down Expand Up @@ -1988,9 +1987,9 @@ select {
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.transition {
transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
Expand Down Expand Up @@ -2018,9 +2017,9 @@ select {
@apply font-light;
} */
.prose a {
transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
Expand Down Expand Up @@ -2054,9 +2053,9 @@ img.emoji {
max-width: 100vw;
}
.mailto {
transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
transition-duration: 150ms;
}
Expand Down
18 changes: 17 additions & 1 deletion src/about/index.pug
Original file line number Diff line number Diff line change
Expand Up @@ -137,7 +137,7 @@ block content
p
strong Familiar with:
br
| Midjourney, TouchDesigner, MadMapper, LiveSurface, Webflow, Squarespace, Cargo, WordPress, Artivive, Basecamp, Trello, Jira, Google Workspace, Microsoft Office, Dropbox, Slack, Twinmotion, Rhino, SketchUp
| Affinity, Midjourney, TouchDesigner, MadMapper, LiveSurface, Webflow, Squarespace, Cargo, WordPress, Artivive, Basecamp, Trello, Jira, Google Workspace, Microsoft Office, Dropbox, Slack, Notion, Google Analytics, Twinmotion, Rhino, SketchUp
br
p
strong Presentation and facilitation:
Expand All @@ -153,6 +153,14 @@ block content
div
p.caption Recognition
br
p
strong
a.underline(href="https://www.wallofportfolios.in/portfolios/shakeel-mohamed/" target="_blank") Wall of Portfolios
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚨 suggestion (security): Consider adding rel="noopener noreferrer" to external links that open in a new tab.

For target="_blank" links, adding rel="noopener noreferrer" prevents the new tab from accessing window.opener on the origin page. For example:

a.underline(
  href="https://www.wallofportfolios.in/portfolios/shakeel-mohamed/"
  target="_blank"
  rel="noopener noreferrer"
) Wall of Portfolios

Please apply this consistently to the new external links (including the AIGA Design Conference link).

Suggested implementation:

                strong
                    a.underline(
                        href="https://www.wallofportfolios.in/portfolios/shakeel-mohamed/"
                        target="_blank"
                        rel="noopener noreferrer"
                    ) Wall of Portfolios

            p
                strong
                    a.underline(
                        href="https://www.bestfolios.com/portfolio/shakeelmohamed"
                        target="_blank"
                        rel="noopener noreferrer"
                    ) Bestfolios

There is also an AIGA Design Conference link mentioned in your review comment that is not visible in this snippet. You should locate that a tag in src/about/index.pug (or related partials) and ensure that, if it uses target="_blank", it also includes rel="noopener noreferrer" in the same way as shown above.

br
| Featured Portfolio
br
| 2025
br
p
strong
a.underline(href="https://www.bestfolios.com/portfolio/shakeelmohamed" target="_blank") Bestfolios
Expand Down Expand Up @@ -213,6 +221,14 @@ block content
div
p.caption Speaking
br
p
strong
a.underline(href="https://www.linkedin.com/posts/activity-7376647120025694208-nPWb/" target="_blank") AIGA Design Conference (national)
br
| Ask Us Anything 3.0: Dr. Cheryl D. Miller and Invited West Coast BIPOC Best Performing Designers
br
| 2025
br
p
strong
a.underline(href="https://www.instagram.com/p/DKiB81WBxfX/" target="_blank") Work in Progress
Expand Down
32 changes: 30 additions & 2 deletions todo.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,15 +14,15 @@ https://cardiff.marketing/pug-in-eleventy-making-it-work/
## ASAP

- [X] update resume with Talisman Freelance Senior designer
- [ ] skills to add: Google Analytics, Notion
- [ ] update skills on resume PDF: Google Analytics, Notion, Affinity (and match order)
- [ ] move all logo family / kit of parts stuff to the bottom of each project (before process)
- [ ] MJ: brand guidelines
- [ ] MJ: brand inspiration book (better name)
- [ ] secret/hidden landing pages for video editing, tech, etc.

## Bio revision

- [ ] TPS: wristband motion... there is not face between inside/outside oops!
- [ ] TPS: wristband motion... there is not face between inside/outside oops! Also make it loop perfectly
- [ ] TPS: show motion design system (3x vertical social posts, LT, slates/bumpers) - show the system/grid, adaptive resizing
- [ ] check OG images for projects, then posts, etc. Consider gif/video versions
- [ ] Experience... consider Parenthetical titles or in 1 line summary at the top: Product Manager (Functionally leading roadmap without formal title)
Expand Down Expand Up @@ -80,6 +80,34 @@ Others
- [ ] TPS: process is missing
- [ ] Can update bio to speak about trained as a designer all along (clearly explain why I changed careers)

## From Petrula

don’t say microsite
- hiring + creative talent
- less spreads for Rothko, less motion on egawa just make it stills
- say documentary
- better transition between projects
- thesis at the end + lead in with speaking
- research was informed by deep research, the next project is also a deep exploration of that + includes my work for Mark Rothko

## Positioning reflection @ graduation

I have the rest of my life to prove this thesis - this is my design philosophy

There’s nothing left to prove, I already did that throughout my entire MFA before this

like PV said “I’m already over-qualified to speak about my thesis”

I need to claim my expertise, balance with humility

I didn’t come to accd to become a GD, but edu limits that scope + industry definition of GD….
——> would be more respected in 20 years
— > I never wanted to be the BEST GD

Teaching would be rly good for me, but need to find a better fit

Hermes - highest vis sponsored studio ever, and being the TA is the validation fs


## Grad show

Expand Down