Recent Portfolio Examples

Webflow Websites

Lin Tian Lab's home page.
Complete

Dr. Lin Tian Lab

Stellate Communications website for Dr. Lin Tian of Max Planck. Recruit new students, communicate the work of the laboratory. I was provided Adobe XD files, content, and graphics. Launched mid-January 2024.

Neal lab website research page.
Complete

Dr. Sonya Neal Lab

Stellate Communications website for Dr. Sonya Neal of UCSD. Recruit new students, communicate the work of the laboratory. I was provided Adobe XD files, content, and graphics. Launched late September 2023.

NeuroTech course home page.
Complete

NeuroTech Course

Stellate Communications project. NeuroTech Course is a course offered on demand online or annually in person. This is the marketing site for the course. I was provided with Adobe XD files, content, and graphics to assemble this site. Site launched early October, 2023.

Estrogens, Cardiometabolic Health, and Female Cognitive Aging website home page.
Complete

Estrogens, Cardiometabolic Health, and Female Cognitive Aging

Website created via Stellate Communications. From provided XD file, content, and graphics, created this site. Includes extensive use of collections. Client is currently maintaining the site using the editor. Goal of the site is to communicate grant status with the National Institutes of Health and other stakeholders who are familiar with this architecture of projects and cores. Site launched summer 2023.

Stellate Communications website.
Complete

Stellate Communications

Stellate Communications is a current employer. Shortly after hiring me, they had me create this website from an Adobe XD graphic design, content, and other provided graphics. Site launched spring 2023.

JenKramer.org home page
Complete

JenKramer.org

Personal website describing courses created, free resources, blogs, social media, and contact information. Site launched January 2023.

Webflow Courses

No-Code CSS Layouts with Webflow

No-Code CSS Layouts with Webflow

LinkedIn Learning
,
2024

Cascading Style Sheets, or CSS, is foundational to web development. Webflow allows you to create websites without code, but it's even easier and faster if you already know fundamental CSS layout concepts. In this course, explore the potential uses of CSS in Webflow with web design expert Jen Kramer.

Discover the basics of Webflow's CSS model to get started creating containers, blocks, and layouts for CSS conversion. Learn how to use Grid and Flexbox for advanced layouts as well as static, relative, and absolute positioning of elements. Along the way, Jen provides an overview of floats and breaks and how they affect page flow in your design. By the end of this course, you’ll be equipped with tips and techniques for creating and managing more efficient CSS properties in Webflow.

Webflow CMS logo.

Webflow - Collections and CMS

LinkedIn Learning
,
2023

Webflow allows you to create professional-looking websites without writing a single line of code. It also lets you manage large amounts of repetitive content using a customizable database called a collection. In this course, instructor Jen Kramer shows the basics of how to add, organize, and manage a structured collection behind your Webflow interface.

Explore the advantages of using collections to sort complex information and how to display collection lists, detail pages, and more. Jen offers pointers and practical strategies to apply category filters and display collections as you go. Along the way, test out your new technical know-how in the practice challenges at the end of each section. By the end of this course, you’ll be prepared to take your Webflow skills to the next level and design more dynamic content for your site.

Learning Webflow 2023 course image.

Learning Webflow 2023

LinkedIn Learning
,
2023

If you are a web designer, a UX designer, or a content publisher working on websites or intranet sites, Webflow can be a great tool to know. It empowers you to build professional, responsive, customized sites using a completely visual canvas—no coding required! In this course, web design and development instructor Jen Kramer introduces you to Webflow and all the basics of what you can do with it. Jen steps through creating a starting style guide for a Webflow website. Once that's established, she moves on to building the initial homepage and populating it with images and content. She shows you how to style the site’s content, as well as the navbar and footer, then covers how to build an inside page and link the navbar to existing pages. Once you have your pages ready, Jen shows you how to launch your site and take the necessary steps to maintain it.


Webflow Collections and CMS 2024.

Webflow Collections and CMS 2024

LinkedIn Learning
,
2024

With Webflow CMS, you can add a database behind your Webflow interface to efficiently manage Webflow apps and content. Learn the advantages of this approach with expert Jen Kramer as she steps through the creation and population of Collections, also known as Webflow databases. Learn how to connect these Collections to both list and detail views on your website and how to filter your Collections to show the appropriate content to your site visitors at the right moments. Upon finishing this course, you’ll be equipped with the skills you need to craft more responsive, dynamic, and engaging websites with Webflow CMS.

Designing from Figma to Webflow image.

Designing from Figma to Webflow

LinkedIn Learning
,
2024

In this course, web design and development expert Jen Kramer introduces you to a very useful new workflow that enables you to create your site layout in Figma, then move to Webflow to create the same custom website without code. Explore the essential aspects of your Figma files that are critical for working in Webflow. Find out how to mark individual assets in Figma for export to Webflow, as well as how to compress image and media assets for Webflow. Dive into creating a basic Webflow site for your exported assets, and learn how to integrate your Webflow code, CSS, and images to build out the right look/feel. Plus, go over ways you can make your Webflow views responsive to support all device sizes and screens.

Learning Webflow course image

Learning Webflow 2024

LinkedIn Learning
,
2024

Webflow, a leading hosted web design and development platform, empowers you to build professional, responsive, customized sites using a completely visual canvas—no coding required! In this course, web design and development instructor Jen Kramer introduces you to Webflow and all the basics of what you can do with it. Jen steps through creating a starting style guide for a Webflow website. Once that's established, she moves on to building the initial homepage and populating it with images and content. She shows you how to style the site’s content, as well as the navbar and footer, then covers how to build an inside page and link the navbar to existing pages. Once you have your pages ready, Jen shows you how to launch your site and take the necessary steps to maintain it. Whether you’re a web designer, a UX designer, or a content publisher working on websites or intranet sites, Webflow can be a great addition to your tool kit.

Learning objectives

  • Describe the basics of the Webflow interface and how it publishes content.
  • Break down the steps for creating the visual aspects of a Webflow site without code.
  • Explain how to create content and navigation for your Webflow site.
  • Customize a site with basic functionality.
  • Recognize how to publish and maintain your Webflow website.

Web strategy courses

No Code Planing Principles for the Web course image.

No-Code Planning Principles for the Web

LinkedIn Learning
,
2022

Do you have an idea for a new app or product but don’t know what it takes to get it built? No-code tools can create incredible web-based outcomes. But you need to plan wisely, think about your design, and choose the tool that’s right for you. In this course, instructor Jen Kramer shows you how to plan a successful no-code project by mapping out your entire workflow at the onset.

Discover planning strategies to stay focused and work more efficiently, boosting your productivity along the way. Jen offers tips on how to clarify the purpose and value of your product, create and maintain a unique style and brand, and identify your specific data and user flows so you’re fully prepared when it’s time to start building. Find out why it’s so important to assess your options to ensure you get the most out of your tools. There’s nothing worse than backtracking to solve problems—so why not plan ahead to set yourself up for success?

Planning Your No-Code Website course image.

Planning Your No-Code Website

LinkedIn Learning
,
2020

Making your own website may be easier than ever before, with the amount of services, sites, and tools at your disposal, but all those options and choices may lead to decision paralysis. What domain do you pick? What hosting service do you use? How do you design the site to match your brand?

Let longtime LinkedIn Learning instructor Jen Kramer show you the way. In this course, Jen covers the important decisions to be made in the no-code website realm, from the first decisions, to building the site, to maintaining the site after creation. She covers factors to consider when making personal aesthetic choices such as fonts, tone, and imagery, as well as technical aspects like choosing a platform, optimizing images for the web, and improving website performance. If you have an idea or brand you want to promote with a website, this course will give you the tools to help you get up and running.

No-Code Web Design Weekly course image.

No-Code Web Design Weekly

LinkedIn Learning
,
2019

You—a person with little or no training in web design—have found yourself in charge of a website. Maybe even two. While your task might initially seem daunting, designing and running a great site is completely within your powers. In this weekly series, Jen Kramer shows you how, providing quick, actionable tips designed to help accidental web designers like yourself create and manage high-quality sites. Learn new techniques in the areas of content, marketing, and technology, from how to define your website’s voice to how to effectively focus your social media messaging. Plus, Jen provides a weekly question to consider with other accidental web designers in the course’s LinkedIn Group. Tune in every Wednesday for a new tip.

Planning Successful Websites and Apps course image.

Planning Successful Websites and Apps

O'Reilly Media
,
2016

You’re new at your job. You’re a project manager and you’ve just been tasked with overseeing the new website. You’re thrilled! But you’re also freaked out because you’ve never led a project like this in your life. Don’t despair. In this video course, web design vets Jen Kramer and Heather O’Neill will put your mind at ease and mentor you towards gold. They’ll show you, in step-by-step fashion, how to plan and design a website—from defining site goals and choosing a target audience to designing a page architecture and establishing a tone of voice. Along the way, you’ll learn about project outlines, must-know business concepts (value proposition, success metrics, etc.), branding, ethnographic research, market research, personas, information architecture, UX design, usability testing, and more. By the end of the course, you’ll be able to deliver a website specification that’s ready to code...and impress your boss.

© 2000-2025 Jen Kramer. All right reserved.