- Scan ID:
- 0490c831-369f-43b3-a0c3-0bad1ac9c298Finished
- Submitted URL:
- https://flowuxdesign.com/redesign.html
- Report Finished:
Links · 0 found
The outgoing links identified from the page
JavaScript Variables · 5 found
Global JavaScript variables loaded on the window object of a page, are variables declared outside of functions and accessible from anywhere in the code within the current scope
| Name | Type |
|---|---|
| onbeforetoggle | string |
| documentPictureInPicture | string |
| onscrollend | string |
| Swiper | string |
| swiper | string |
Console log messages · 1 found
Messages logged to the web console
| Type | Category | Log |
|---|---|---|
| warning | other |
|
HTML
The raw HTML body of the page
<!--
**********************************************************************************************
**********************************************************************************************
**********************************************************************************************
**********************************************************************************************
Release Notes: 9/1/2024
Author: Ryan P. Manning
Tools Used: Visual Studio, Figma, Photoshop, Illustrator
https://www.flowuxdesign.com
This site was created and coded by Ryan Manning. A design leader who understands
code and has a strong working relationship with mobile first responsive design. This
site is an example of the code we can deliver to help articulate design impact in a
responsive manner. This is not intended to be a front UI production level enterprise
solution. The aim is to prove we know the technology and its limitations, to inform
better digital experiences.
**********************************************************************************************
**********************************************************************************************
**********************************************************************************************
**********************************************************************************************
--><!DOCTYPE html><html lang="en"><head>
<meta charset="UTF-8">
<!-- <meta name="viewport" content="initial-scale=1.0"> -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta property="og:title" content="FLOW UX Design LLC">
<meta property="og:image" content="https://www.flowuxdesign.com/images/previewredesign.png">
<title>Welcome to FLOW UX Design LLC</title>
<link rel="stylesheet" href="stylesRedesign.css">
<!--
<link rel="stylesheet" href="1200.css">
<link rel="stylesheet" href="768.css">
<link rel="stylesheet" href="400.css">
-->
<!-- Swiper CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css">
<!-- CSS -->
<link rel="stylesheet" href="css/sliderstyle.css">
</head>
<body>
<div id="background">
<div id="Desktop">
<!-- Mobile Navigation -->
<div class="off-screen-menu">
<div id="menulogo"><img src="images/FlowLogoWhiteMastead.png" width="225"></div>
<div id="mobileNavItem"><a href="#" style="color: #FFF; text-decoration: none;">SERVICES</a></div>
<div id="mobileNavItem"><a href="#" style="color: #FFF; text-decoration: none;">INSIGHTS</a></div>
<div id="mobileNavItem"><a href="#" style="color: #FFF; text-decoration: none;">INDUSTRIES</a></div>
<div id="mobileNavItem"><a href="#" style="color: #FFF; text-decoration: none;">ABOUT FLOW</a></div>
<div id="mobileNavItem"><a href="#" style="color: #FFF; text-decoration: none;">CLIENT LOGIN</a></div>
<div id="contactmenu">Get In Touch</div>
</div>
<nav>
<div class="ham-menu">
<span></span>
<span></span>
<span></span>
</div>
</nav>
<!-- End Mobile Navigation -->
<!-- Start Main Conetent -->
<div id="page_content">
<video id="bostonvideo" autoplay="" muted="" preload="auto"><source src="images/mov/boston.mp4" type="video/mp4">Your browser does not support the video tag.</video>
<div id="bostonpng"><img src="images/boston.png" style="width: 100%; vertical-align: middle;"></div>
<!-- Start Process Conetent -->
<div id="processcontainer">
<div id="process">
<div id="processtitle">
The Process
</div>
<div id="processdescription">
Understanding user needs to create designs that deliver business value.
<ul style="font-size: 14px; padding-left: 40px; padding-bottom:0px; padding-top:16px; color:#e5f4ff;">
<li>Empathise</li>
<li>Define</li>
<li>Ideate</li>
<li>Prototype</li>
<li>Test</li>
<li>Implement & Learn</li>
</ul>
</div>
</div>
<div id="processcontent868">
<div id="looptitle">Experiences that drive growth & engagement </div>
<img src="images/process868.svg" style="align-self: right; width: auto; height: 317px; object-fit: cover; margin: 0px; padding: 0px; display: block;">
</div>
<div id="processcontent502">
<img src="images/process502.svg" style="width: 100%; height: 317px; object-fit: cover; margin: 0px; padding: 0px; display: block;">
</div>
<div id="processcontent300">
<img src="images/process300.svg" style="width: 100%; height: 211px; object-fit: cover; margin: 0px; padding: 0px; margin-bottom: 16px; display: block;">
<div id="processlables">
<div style="font-size: 14px; font-weight: 700; color: #666666; font-family: Avenir Next;">01 Empathize</div>
<div style="font-size: 14px; font-weight: 500; color: #999999; font-family: Avenir Next;">Conduct user research to gather insightful information about end-users' needs and problems.</div>
<div style="height:1px; background-color: #cccccc; margin-bottom: 8px; margin-top: 4px;"></div>
<div style="font-size: 14px; font-weight: 700; color: #bd1c1c; font-family: Avenir Next;">02 Define</div>
<div style="font-size: 14px; font-weight: 500; color: #999999; font-family: Avenir Next;">Clearly define the problem based on insights gathered during the first phase.</div>
<div style="height:1px; background-color: #cccccc; margin-bottom: 8px; margin-top: 4px;"></div>
<div style="font-size: 14px; font-weight: 700; color: #deb821; font-family: Avenir Next;">03 Ideate</div>
<div style="font-size: 14px; font-weight: 500; color: #999999; font-family: Avenir Next;">Brainstorm creative solutions and encourage divergent thinking & possibilities </div>
<div style="height:1px; background-color: #cccccc; margin-bottom: 8px; margin-top: 4px;"></div>
<div style="font-size: 14px; font-weight: 700; color: #666666; font-family: Avenir Next;">04 Prototype</div>
<div style="font-size: 14px; font-weight: 500; color: #999999; font-family: Avenir Next;">Develop a tangible or visual representation of the solution to test its functionality and effectiveness.</div>
<div style="height:1px; background-color: #cccccc; margin-bottom: 8px; margin-top: 4px;"></div>
<div style="font-size: 14px; font-weight: 700; color: #E05708; font-family: Avenir Next;">05 Test</div>
<div style="font-size: 14px; font-weight: 500; color: #999999; font-family: Avenir Next;">Show your protype to users to see how they respond</div>
<div style="height:1px; background-color: #cccccc; margin-bottom: 8px; margin-top: 4px;"></div>
<div style="font-size: 14px; font-weight: 700; color: #23A13E; font-family: Avenir Next;">06 Implement</div>
<div style="font-size: 14px; font-weight: 500; color: #999999; font-family: Avenir Next;">Build and launch the solution, and monitor and analyse</div>
<div style="height:1px; background-color: #cccccc; margin-bottom: 8px; margin-top: 4px;"></div>
</div>
</div>
</div>
<!-- End Process Conetent -->
<!-- Start Industries Conetent -->
<div id="industriescontainer">
<div id="industriescontent">
<div id="industriestitle">Services</div>
<!-- Start Slider -->
<div class="slide-container swiper">
<div class="slide-content swiper-initialized swiper-horizontal swiper-backface-hidden">
<div class="card-wrapper swiper-wrapper" style="cursor: grab;" id="swiper-wrapper-25fb1d7972cf8fb6" aria-live="polite">
<div class="card swiper-slide swiper-slide-active" role="group" aria-label="1 / 4" data-swiper-slide-index="0" style="width: 216.667px; margin-right: 16px;">
<div class="icon">
<img src="images/designstrategy.svg" width="125">
</div>
<div class="card-content">
<h2 class="name">Design Strategy</h2>
</div>
</div>
<div class="card swiper-slide swiper-slide-next" role="group" aria-label="2 / 4" data-swiper-slide-index="1" style="width: 216.667px; margin-right: 16px;">
<div class="icon">
<img src="images/prototype.svg" width="125">
</div>
<div class="card-content">
<h2 class="name">Rapid Prototyping</h2>
</div>
</div>
<div class="card swiper-slide" role="group" aria-label="3 / 4" data-swiper-slide-index="2" style="width: 216.667px; margin-right: 16px;">
<div class="icon">
<img src="images/creative.svg" width="125">
</div>
<div class="card-content">
<h2 class="name">Creative Execution</h2>
</div>
</div>
<div class="card swiper-slide" role="group" aria-label="4 / 4" data-swiper-slide-index="3" style="width: 216.667px; margin-right: 16px;">
<div class="icon">
<img src="images/useranalysis.svg" width="125">
</div>
<div class="card-content">
<h2 class="name">User Analysis</h2>
</div>
</div>
</div>
<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span></div>
<div class="swiper-button-next swiper-navBtn" tabindex="0" role="button" aria-label="Next slide" aria-controls="swiper-wrapper-25fb1d7972cf8fb6"></div>
<div class="swiper-button-prev swiper-navBtn" tabindex="0" role="button" aria-label="Previous slide" aria-controls="swiper-wrapper-25fb1d7972cf8fb6"></div>
<div class="swiper-pagination swiper-pagination-clickable swiper-pagination-bullets swiper-pagination-horizontal swiper-pagination-bullets-dynamic" style="width: 80px;"><span class="swiper-pagination-bullet swiper-pagination-bullet-active swiper-pagination-bullet-active-main" tabindex="0" role="button" aria-label="Go to slide 1" aria-current="true" style="left: 24px;"></span><span class="swiper-pagination-bullet swiper-pagination-bullet-active-next" tabindex="0" role="button" aria-label="Go to slide 2" style="left: 24px;"></span><span class="swiper-pagination-bullet swiper-pagination-bullet-active-next-next" tabindex="0" role="button" aria-label="Go to slide 3" style="left: 24px;"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 4" style="left: 24px;"></span></div>
</div>
<!-- End Slider -->
</div>
</div>
<!-- End Industries Conetent -->
<!-- Start Insights Conetent -->
<div id="insightscontainer">
<div id="insightscontent">
<div id="insightstitle">Key Insights</div>
<div id="insightwrapper">
<div id="insightone">
<div id="insightshero"><img src="images/strategy.png" width="100%"></div>
<div id="insightssubhead">ARTICLE</div>
<div id="insightsheadline">Apple's Strategy & Introduction of AI in iPhone 16</div>
<div id="insightscopy">
A sound strategy emerges at the critical intersection of business impact, financial impact, and user needs. <a href="#" style="color: #1C75BC;">(more...)</a>
</div>
</div>
<div id="insighttwo">
<div id="insightssubhead">ARTICLE</div>
<div id="insightsheadlinelarge">How is AI changing the face of Design Systems?</div>
<div id="insightscopy">
<div id="dsaiwrapper">
<div id="dsaicontent">
Generative AI (GenAI) is revolutionizing modern design systems by offering unprecedented opportunities for efficiency and scalability. This is where GenAI comes into play. <a href="#" style="color: #1C75BC;">(more)</a>
</div>
<div id="dsailogo">
<img style="display: block; margin-left: auto; text-align: justify; float: right; margin: 8px; opacity: .5;" src="images/genai.png" width="150px">
</div>
</div>
<div id="dsaiimage">
<img id="dsai" src="images/dsai.png">
</div>
</div>
</div>
<div id="insightthree">
<img src="images/Headshottall.png" style="margin-left: 8px;" width="50%">
<div id="insightssubhead">Author: Ryan Manning</div>
<div id="insightsheadline" style="margin-top:6px;">About Key Insights</div>
<div id="insightscopy">
Insights help to assess industry trends, understand user needs & gain valuable information.
</div>
</div>
</div>
</div>
</div>
<div id="insightsgrad"></div>
<!-- End Insights Conetent -->
<!-- Start Testimonials Content -->
<div id="testimonialscontainer">
<div id="testimonialscontent">
<div id="testimonialstitle">Testimonials</div>
<div id="testimonialswrapper">
<div id="testimonial">
<div id="quote">"A rare combination of technical expertise, strategic vision and interpersonal skills."</div>
<div id="partner">- Nikolai T. <br><span style="font-size: 12px;">(Lead iOS Engineer)</span></div>
</div>
<div id="pipe" style="width: 1px; height: 200px; background-color: #b3b3b3; margin-left: 16px; margin-right: 16px;"></div>
<div id="testimonial">
<div id="quote">"Well-rounded, the glue that holds the creative projects together."</div>
<div id="partner">- Elizabeth N. <br><span style="font-size: 12px;">(Executive Recruiter)</span></div>
</div>
<div id="pipe" style="width: 1px; height: 200px; background-color: #b3b3b3; margin-left: 16px; margin-right: 16px;"></div>
<div id="testimonial">
<div id="quote">"A true creative talent. Great at recruiting & developing design talent and listens well for input from his partners"</div>
<div id="partner">- Fred L. <br><span style="font-size: 12px;">(Founding Director)</span></div>
</div>
<div id="pipe" style="width: 1px; height: 200px; background-color: #b3b3b3; margin-left: 16px; margin-right: 16px;"></div>
<div id="testimonial">
<div id="quote">"Always willing to tell it like it is for the best interest of the customer."</div>
<div id="partner">- Chris C. <br><span style="font-size: 12px;">(Mobile Product Owner)</span></div>
</div>
</div>
</div>
</div>
<!-- End Testimonials Content -->
<!-- Start Footer Conetent -->
<div id="footercontainer">
<div id="footercontent">
<div id="footerlogocontainer">
<img id="footerlogo" src="images/footerlogo.png">
</div>
<div id="footerclientlogin">
<div id="footertest"></div>
<div id="footerloginlock"><img src="images/footerlock.png"></div>
<div id="footerclientlogintext">CLIENT LOGIN</div>
</div>
<div id="socialscontainer">
<div id="socialsspacer"></div>
<div id="linkedin"><img src="images/linkedin.svg"></div>
<div id="facebook"><img src="images/facebook.svg"></div>
<div id="instagram"><img src="images/instagram.svg"></div>
<div id="twitter"><img src="images/x.svg"></div>
</div>
<div id="contactinfo">
<div style="font-weight: 600;">FLOW UX Design LLC</div>
<div style="font-size: 12px;">9 Mercer Road <br>
Needham MA 02494<br>
(617) 800-4308<br>
<a href="#" style="color: #1C75BC;">[email protected]</a><br></div>
</div>
<div id="footernav">
<div id="footernavspacer"></div>
<div id="footeritem">Services</div>
<div id="footeritem">Insights</div>
<div id="footeritem">Industries</div>
<div id="footeritemlast">About FLOW</div>
</div>
<div id="copywritecontainer">
<div id="copywrite">© Copywrite 2024 FLOW UX Design LLC All Rights Reserved</div>
<div id="copywritespacer"></div>
</div>
<div id="footerwave">
<img src="images/WavesLight.png" width="100%">
</div>
</div>
</div>
<!-- End Footer Conetent -->
</div>
<!-- Start Main Conetent -->
<!-- Start Masthead Conetent -->
<div id="login">
<div id="lockicon"><img src="images/lock.png"></div>
<div id="clientlogin">CLIENT LOGIN</div>
</div>
<div id="logocontainer">
<img id="logo" src="images/FlowLogoWhiteMastead.png">
</div>
<div id="heroimagecontainer">
<img src="images/WavesLight.png" id="heroimage" width="100%">
</div>
<div id="nav">
<div id="item_one">About FLOW</div>
<div id="item">Industries</div>
<div id="item">Insights</div>
<div id="item"><a href="services.html" style="color: #FFF; text-decoration: none;">Services</a></div>
</div>
<div id="nav_mask"></div>
<div id="nav_grad"></div>
<!-- End Masthead Conetent -->
</div>
</div>
<script>
const hamMenu = document.querySelector(".ham-menu");
const offScreenMenu = document.querySelector(".off-screen-menu");
hamMenu.addEventListener("click", () => {
hamMenu.classList.toggle("active");
offScreenMenu.classList.toggle("active");
});
</script>
<!-- Swiper JS -->
<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
<!-- JavaScript -->
<script src="js/sliderscript.js"></script>
</body></html>