- ID de l'analyse :
- 0490c831-369f-43b3-a0c3-0bad1ac9c298Terminée
- URL soumise :
- https://flowuxdesign.com/redesign.html
- Fin du rapport :
Liens : 0 trouvé(s)
Liens sortants identifiés à partir de la page
Variables JavaScript : 5 trouvée(s)
Les variables JavaScript globales chargées dans l'objet fenêtre d'une page sont des variables déclarées en dehors des fonctions et accessibles depuis n'importe quel endroit du code au sein du champ d'application actuel
| Nom | Type |
|---|---|
| onbeforetoggle | string |
| documentPictureInPicture | string |
| onscrollend | string |
| Swiper | string |
| swiper | string |
Messages de journal de console : 1 trouvé(s)
Messages consignés dans la console web
| Type | Catégorie | Enregistrement |
|---|---|---|
| warning | other |
|
HTML
Le corps HTML de la page en données brutes
<!--
**********************************************************************************************
**********************************************************************************************
**********************************************************************************************
**********************************************************************************************
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>